vue中的$emit方法

使用場景：

　　今天遇到一個需要在js中獲取select標簽中key和label值，但此時的select是自定義的封裝ISelect,封裝的方法中遇到$emit，特此總結一下

1、父組件可以使用 props 把數據傳給子組件。
2、子組件可以使用 $emit,讓父組件監聽到自定義事件 。

vm.$emit( event, arg ) //觸發當前實例上的事件

vm.$on( event, fn );//監聽event事件后運行 fn； 

封裝的方法：

<el-select v-model="" :placeholder="" @chenge="doSelect"></select>

methods:{
  doSelect(type){
      var label = this.options.filter(v=>v.value==type)[0].label;
      this.$emit('getLabel',label);
  }  
}

 

調用時使用：

<ISelect :url="'/comm/com/listAllCompany'"  v-model="" @getLabel="getName">

methods{
    getName(data){
       alert(data);//此時的data就是封裝的方法中傳過來的label
    }
}