最新下载
热门教程
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
Vue中$attrs与$listeners使用代码示例
时间：2022-06-29 02:02:41 编辑：袖梨 来源：一聚教程网
本篇文章小编给大家分享一下Vue中$attrs与$listeners使用代码示例，文章代码介绍的很详细，小编觉得挺不错的，现在分享给大家供大家参考，有需要的小伙伴们可以来看看。
介绍
$attrs
继承所有的父组件属性（没有通过 props 接收的属性还有 class 类名 和 style 样式 ）。
inheritAttrs：
是否非 props 属性显示在标签最外层，默认值 true ，就是继承所有的父组件属性（除了 props 特定绑定外）作为普通的HTML特性应用在子组件的根元素上，如果你不希望组件的根元素继承特性就设置 inheritAttrs: false ,但是 class 还是会继承。
$listeners
它是一个对象，能接收所有的方法绑定，里面包含了作用在这个组件上的所有监听器，配合 v-on="$listeners" 将所有的事件监听器指向这个组件的某个特定的子元素。
举例
父组件中
子组件中
可见，当 inheritAttrs 默认 false 时，属性是传入到子组件最外层的
当 inheritAttrs 为 true 后
当使用props接收属性时，属性就不会被显示
总结：组件标签上传入的属性如果子组件没有接收会跑到子组件标签最外层。
非 props 属性可以通过 $attrs 接收 {属性名：属性值}
当给子组件绑定点击事件时，是不会触发点击事件的，可以使用 .native 修饰符进行绑定成功
或者通过 $listeners 进行接收所有方法的绑定
子组件内
结果
相关文章
- 《1号会员店》关闭自动续费方法 01-29
- 《排球少年：新的征程》社团每日福利领取方法 01-29
- 《椿之歌》新手风属性队伍推荐 01-29
- 《最终幻想14：水晶世界》小小阿托莫斯宠物获得方法 01-29
- 《燕云十六声》醉拳客打法攻略 01-29
- 《异人之下》全货币获取方法汇总 01-29