当我们去二次封装别人组件时,可能别人组件上有很多属性,我们不想再次重写一遍
这时候就可以使用v-bind="$attrs" 和 v-on="$listeners"
。这是vue 2.4 版本提供
vm.$attrs
是一个属性,其包含了父作用域中不作为 prop 被识别 (且获取) 的特性绑定 (class 和 style 除外)。这些未识别的属性可以通过 v-bind="$attrs"
传入内部组件。未识别的事件可通过v-on="$listeners"
传入。
举个例子,比如我创建了我的按钮组件myButton
,封装了 element-ui 的 el-button 组件(其实什么事情都没做),在使用组件 <my-button />
时,就可以直接在组件上使用 el-button 的属性,不被 prop 识别的属性会传入到 el-button 元素上去
<template> <div> <el-button v-bind="$attrs">确定</el-button> <div> </template> // 父组件使用 <my-button type='primary' size='mini'/>
非常的方便!