碎言博客

Vue快速学习笔记(4)Vue组件中的数据传递

J.sky 2020-02-11 15:33:53 Vue

Vue组件中的数据传递

父组件向子组件传递数据:

示例代码

<!-- 开发环境版本,包含了有帮助的命令行警告 -->
<script src="assets/plugins/vue.js"></script>
<template id="mh">
    <h1> {{finfo}}</h1>
</template>

<div id="app">
    <mh finfo="子组件的数据"></mh>
    <mh :finfo="msg"></mh>
</div>

<script>
    var vm = new Vue({
        el: "#app",
        data: {
            msg:"这是父组件Vue实例中传来的消息。"
        },
        components:{
            mh:{
                template:"#mh",
                props:['finfo']
            }
        }
    });
</script>

子组件向父组件传值

发现错误?想参与编辑? 在 GitHub 上编辑此页!

如果您有什么问题,欢迎加入Python/Javascript学习讨论群询问

Python/Javascript学习QQ群号:217840699