父组件给子组件传惨
1、在占位符中 :a=“fmsg” fmsg父组件的数据 a代表的是在子组件中使用的数据
2、在子组件中定义props属性接收父组件传递过来的数据 props:[‘k’,‘k’]
案例:
<body>
<div id="app">
<h1 @click="change()">这是父组件{{num}}</h1>
<v-header :a="fmsg" :b="num"></v-header>
</div>
<template id="header">
<div>
这是子组件{{a}}
<p>{{b}}</p>
</div>
</template>
<script src="js/vue.js"></script>
<script>
var header={
template:'#header',
props:['a','b']
}
new Vue({
el:'#app',
data:{
fmsg:'这是父组件的数据',
num:0
},
components:{
'v-header':header
},
methods:{
change(){
this.num++
}
}
})
</script>
</body>