vue 父组件与子组件 的概念与区分
<div id="app"><!--<root> 隐性的根组件,相对于注册的全局组件child来说,是父组件--><child msg="hello world"></child><!--child相对ro
·
<div id="app">
<!--<root> 隐性的根组件,相对于注册的全局组件child来说,是父组件-->
<child msg="hello world"></child><!--child相对root来说是子组件,而 msg 这个变量是存在于父组件内的,应该属于父组件里的数据,虽然这个变量不是初始化就定义了的-->
<!--</root>-->
</div>
<script>
//注册一个全局组件,组件标签名为component
Vue.component('child', {
//组件构造器,此为一个对象,其中内容为多选项
props: ['msg'],//接收父组件传递的数据
template: '<span>{{msg}}</span>',
data(){return {val: 2};}, //这才是子组件里面的数据
});
//实例化Vue
new Vue({
el : '#app',
data : {val : 1}, //这个数据是初始化Vue实例就定义的
});
</script>
更多推荐
已为社区贡献1条内容
所有评论(0)