子组件向父组件共享数据,需要自定义事件
1、在子组件中调用this.$emit(参数1,参数2)来触发自定义事件。
说明:参数1:字符串,表示自定义事件的名称,参数2: 值,要发送给父组件的数据
2、在父组件中,通过v-on来绑定自定义事件,并提供一个事件的处理函数。通过事件处理函数的行参,接收到子组件传递过来的数据。
// 子组件
export default{
data(){
return { count: 0}
},
methods: {
add(){
this.count += 1
// 修改数据时,通过$emit()触发自定义事件
this.$emit('numchange', this.count)
}
}
}
// 父组件
<Son @numchange="getNewCount"></Son>
export default{
data(){
return { countFromSon: 0}
},
methods: {
getNewCount(val){
this.countFromSon = val
}
}
}