子组件继承父组件数据

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="bower_components/vue/dist/vue.js"></script>
<style>
</style>
</head>
<body>
<div id="box">
<aaa>
</aaa>
</div>

<template id='aaa'>//定义了为<aaa>的模板这里与div里的标签相对应
<h1>11111</h1>
<bbb :mmm="msg2"></bbb>//将父组件的元素aaa的msg数据绑定到标签bbb上
</template >
<script>
var vm=new Vue({
el:'#box',
data:{
a:'aaa'
},
components:{
'aaa':{
data(){
return {
msg2:'啊啊啊啊啊啊啊啊啊啊啊啊啊啊'
}
},
template:'#aaa',
components:{
'bbb':{
props:['mmm'],
template:'<h3>我是bbb组件->{{mmm}}</h3>'
}
}
}
}
});

</script>
</body>
</html>

posted @ 2018-08-27 09:43  逆水乘舟，不进则退  阅读(384)  评论(0)    收藏  举报