$listeners
Used for low-level components to pass information to high-level components.
For example, there are three components: parent component A, child component B, and grandson component C. If C transmits information to B, you can use $emit directly. If C transmits information to A and uses $emit, then C needs to $emit to B first. B, B then $emit to A, this method is cumbersome, at this time you can use v-on="$listeners" to meet the current needs.
Example:
C component
<template>
<div @click="onClick">C组件</div>
</template>
onClick(){
this.$emit("Msg",'123')
}
B component
<template>
<cCom v-on="$listeners"/>
</template>
A component
<template>
<bCom @Msg='Msg'/>
</template>
methods:{
Msg(val){
console.log(val) //123
}
}
Other related usages of component generation communication:
How to use v-bind="$attrs" in Vue https://blog.csdn.net/weixin_44594219/article/details/127257804?spm=1001.2014.3001.5502 How to use EventBus in vue2 https://blog.csdn. net/weixin_44594219/article/details/127248681?spm=1001.2014.3001.5502