子元件向父元件通訊的兩種方式
阿新 • • 發佈:2019-02-17
方法一:$emit
子元件
methods:{
onClickMe:function (){
this.$emit('functionName',Data)
}
//functionName為父元件裡要繫結的方法,data為向父元件傳遞的資料
父元件
<compinent-a v-on:functionName="listenToMyBoy"></compinent-a>
methods:{
listenToMyBoy:function(data){
console.log(data)
//列印子元件傳來的資料
}
}
方法二:$dispatch
子元件
methods:{
onClickMe:function (){
this.$dispatch('functionName',Data)
//functionName為父元件裡要繫結的方法,data為向父元件傳遞的資料
}
父元件
events:{
‘functionName’:function(data){
console.log(data);
//列印子元件傳來的資料data
}
}