美文网首页
$attrs和$listeners

$attrs和$listeners

作者: 冰点雨 | 来源:发表于2022-06-15 10:47 被阅读0次

$attrs

属于组件的一个属性,可以获取到父组件传递过来的props数据
对于子组件而言,父组件给的数据可以利用props接收。但是,如果子组件通过props接收的属性,在$attrs属性当中是获取不到的

$listeners

属于组件的一个属性,可以获取到父组件给子组件传递的自定义事件

自定义按钮HitButton

<template>
//可以巧妙地利用a标签实现按钮带有提示的功能
   <a :title="title">
  //v-bind不能简写为:  v-on不能简写为@
    <el-button v-bind="$attrs" v-on="$listeners"></el-button>
   </a>
</template>

<script>
 name:"",
props:["title"],
mounted(){
}
</script>

父组件

<template>
 <HitButton type="success" icon="el-icon-delete" size="mini" title="提示文案" @click=“handle”></HitButton>
</template>

<script>
 name:"",
components:{
   HitButton
},
methods:{
   handle(){
     alter(6666)
   }
}
</script>

相关文章

  • Attrs 和 Listeners

    这两个属性是 vue 2.4 版本之后提供的,它简直是二次封装组件或者说写高阶组件的神器。在我们平时写业务的时候免...

  • $attrs和$listeners

    $attrs 属于组件的一个属性,可以获取到父组件传递过来的props数据对于子组件而言,父组件给的数据可以利用p...

  • $listeners /$attrs

    使用方法概括: $attrs 是 父组件绑定给子组件的属性(prop里声明的除外) $listeners 是父...

  • Vue2.4 $attrs、$listeners、inherit

    在开始介绍之前先看下vue官方文档对 $attrs和 $listeners的解释: vm.$attrs包含了父作用...

  • 在Vue中使用JSX踩坑指南

    1.组件使用$attrs和$listeners传递参数时: 发现v-bind和v-on都不好用了,因为$attrs...

  • vue组件通信的几种方式

    1、props 2、$.emit $.on 3、$attrs, $listeners 4、provide / in...

  • $attrs和$listeners的使用

    vue中使v-bind="attrs",将父组件中不被认为props特性绑定的属性(即在父组件中或者说时中间组件中...

  • $attrs, $listeners, inheritAttrs

    2018-06-15创建 组价通信 vue中一个比较令人烦恼的事情是属性只能从父组件传递给子组件。这也就意味着当你...

  • $attrs 与 $listeners

    本文转自[https://juejin.cn/user/2858385961407853] 学会使用listene...

  • vue $attrs, $listeners

    vm.$attrs 包含了父作用域中不作为 prop 被识别 (且获取) 的特性绑定 (class 和 style...

网友评论

      本文标题:$attrs和$listeners

      本文链接:https://www.haomeiwen.com/subject/yrjmmrtx.html