1 通过prop向子组件传递数据
父组件
子组件接收
props:['parentMessage','zz'] //数组形式
props:{ //对象形式
parentMessage:{
type:String,
default:''
},
}
2 $attrs
2-1 父组件parent
<HelloWord foo="food">
2-1 子组件children
3 $ref
3-1 父组件parent
this.$refs.food.xx = 'xxx'//可以调用子组件xx 并能改变值
3-1 子组件children
data(){
return{
xx:'abc'
}
}
4 $children
4-1 父组件parent
$children[0] 代表第0个组件
this.$children[0].xx = '改变子组件值' //子组件不保证顺序
4-1 子组件children
data(){
return{
xx:'abc'
}
}
5 通过自定义事件（子组件）向父组件传递数据
5-1）在子组件中通过$emit来触发事件，传递数据
5-2）在父组件通过v-on来监听子组件事件
子组件定义：
sendChildren(){
//自定义事件，1事件名 2 参数
this.$emit('parentMsg','123456')
}
父组件定义：
injectParent(val){
console.log(val)
}