vue $listeners $attr,vue listeners
本文主要介绍$attrs和$listeners在Vue中的使用的详细说明。通过示例代码非常详细，对大家的学习或者工作都有一定的参考价值。让我们和边肖一起学习。
目录
简介和示例摘要
介绍
$attrs
继承所有父组件属性(不通过props接收的属性包括类名和样式)。
继承者：
非props属性是否显示在标签的最外层，默认值为true，这意味着所有父组件属性(props特定绑定除外)都被继承，并作为普通HTML属性应用于子组件的根元素。如果不希望组件的根元素继承属性，设置inheritAttrs: false，但是类仍然会继承它们。
$听众
它是一个可以接收所有方法绑定的对象。它包含作用于该组件的所有侦听器。使用v-on=$listeners ，它将所有事件侦听器指向该组件的特定子元素。
举例
父组件
模板
div id=应用程序
Son src= https://img 01 . yzcdn . cn/vant/logo . png /Son
/div
/模板
脚本
从导入儿子。/components/son . vue ；
导出默认值{
名称：“应用程序”，
组件：{
儿子，
},
};
/脚本
款式/风格
在子组件中
模板
div id=应用程序
Son src= https://img 01 . yzcdn . cn/vant/logo . png /Son
/div
/模板
脚本
从导入儿子。/components/son . vue ；
导出默认值{
名称：“应用程序”，
组件：{
儿子，
},
};
/脚本
款式/风格
可以看到，当inheritAttrs默认为false时，属性被传递到子组件的最外层。
当inheritAttrs为真时
使用道具领取属性时，属性不会显示。
摘要：如果没有接收到子组件，则上传到组件标签上的属性将运行到子组件标签的最外层。
非props属性可以通过$attrs接收{属性名：属性值}。
模板
差异
img v-bind=$attrs alt= /
/div
/模板
脚本
导出默认值{
inheritantrs:false，
};
/脚本
样式范围。img {
宽度：100px
高度：100px
}
/风格
当一个点击事件被绑定到一个子组件时，点击事件将不会被触发。您可以使用。本机修饰符绑定成功。
或者通过$listeners绑定所有方法。
在子组件内
结果
总结
所有非道具属性都可以通过$attrs接收。
使用：v-bind=$attrs 将所有非props属性绑定到相应的标记，这些标记也可以用于组件。
所有组件上的方法绑定子组件都可以通过$listeners接收。
使用：v-on=$listeners 将所有方法绑定到组件的相应标记，也可用于组件。
这就是这篇关于在Vue中使用$attrs和$listeners的教程的文章。有关Vue $attrs $listeners的更多信息，请搜索我们以前的文章或继续浏览下面的相关文章。希望你以后能支持我们！
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。