vue $emit $on的使用

vm.$emit( event, […args] )

触发当前实例上的事件。附加参数都会传给监听器回调。
vm.$on( event, callback )
监听当前实例上的自定义事件。事件可以由vm.$emit触发。回调函数会接收所有传入事件触发函数的额外参数。
/*子组件通过$emit将参数/事件传出去,父组件通过$on来监听子组件的自定义事件来接受参数*/
//子组件中
<template>         
  <search-input @search='onPageSearch' @searchTeam='getSearchTeam' />     
</template>
methods:{
    onPageSearch(select) {
        this.$emit('searchChart', select)
    },
    getSearchTeam(value) {
        this.$emit('searchType', value)
    }
}
//父组件中
 
 
 
 
<template>
     <general-dialog  @searchChart="onPageSearch" @searchType="getSearchType">  </general-dialog>
</template>
methods:{
    onPageSearch(value) {
       console.log(value)
    },
    getSearchType(value) {

       console.log(value)
    },
}
 
 




猜你喜欢

转载自blog.csdn.net/weixin_32206811/article/details/80280452