1. 程式人生 > >子元件向父元件通訊的兩種方式

子元件向父元件通訊的兩種方式

方法一:$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
    }
}