前言
Vue 3移除了Vue 2的listeners，官方文档写的一知半解，或许你不一定看得懂，今天我说说到底咋回事。
官方迁移文档
https://v3.cn.vuejs.org/guide/migration/listeners-removed.html#移除-listeners
Vue 2如何使用listeners
可以看我写的https://www.jianshu.com/p/a7535e9dec31
现在假定有老头组件<oldman />、儿子组件<son />、孙子组件<grandson />，一共三级。
现在老头想监听孙子组件。步骤：
- 编辑儿子vue组件，原本有
<grandson />，现在是：
<grandson v-on="$listeners" />
- 爷爷组件该怎么监听就怎么监听，孙子组件该怎么emit就怎么emit。很简单。
Vue 2向下传递attr
也是只需编辑儿子vue组件，原本有<grandson />，现在是：
<grandson v-bind="$attrs" />
然后export default {}里面加上inheritAttrs: false,即可。
Vue 3怎么弄
Vue 3照搬2的写法的话会报错：
[Vue warn]: Property "$listeners" was accessed during render but is not defined on instance.
正确做法：
其实更简单，读懂官方说的现在事件监听器是 $attrs 的一部分这句话就行，官方这话意思是，老头组件里的<son @dosomething="dosomething" />现在被当做$attrs的一部分，由$attrs负责传递给后代组件，这时候，儿子组件像Vue 2一样加上inheritAttrs: false,，以及<grandson v-bind="$attrs" />，孙子组件一字不用改，就可以用了。不再需要`v-on="$listeners"。
总结
忘掉v-on="$listeners"，别的跟Vue 2一毛一样。
