Vue中$attrs、$listeners的用法总结

发布时间 2023-04-10 15:19:12作者: 茶记忆

用法如下:

1、v-on="$listeners"

父组件A,子组件B,孙组件C。
C组件中emit事件后,在B中可以直接使用v-on="$listeners"接收,此时可以在A组件中的B上直接使用C中emit出来的事件。

2、v-bind="$attrs"
父组件A,子组件B,孙组件C。
A上设置值,若没在B上用props进行接收,则可以直接在B中的C设置v-bind="$attrs",此时相当于把属性直接设置在C上。

 

这两个的作用,主要是用在二次封装某些组件的时候,比如二次封装elementUI 或者antd 组件的时候,使用这样的方法,不需要知道组件具体的属性或者参数,即可实现相应的封装功能。