1. 什么是 attrs

• Vue 的观点，对于传递到组件中的属性

  • 定义在 props 选项里面的属性称为 props
  • 没有定义在 props 里面的属性称为 attrs (非 props 注册的 attributes)

• 如何在组件上传递 attributes, 让子组件能够获取并使用 attributes

  • 在 options API 中，直接传入属性并使用 $attrs 访问
  • 在 composition API 中，需要使用 getCurrentInstance 进行访问

2. 使用 attrs 时注意

1. 单个的根元素, 使用组件时, 属性都会增加到根元素上 (非 props 注册)
2. 单个的根元素, 原生的事件, 可以直接传递出来 change(e)
3. 像1，2的现象, 称之为 attrs 的继承, attrs 的继承是可以被禁用的

3. 禁用 attrs 的继承

• optionsAPI设置inhreitAttrs: false
• 禁用attrs的好处: 可以控制$attrs不显示在根元素上, 并指定其中需要$attrs的元素

4. 直接调用 attrs

• 直接调用attrs: v-bind="$attrs" (value="xxx"; contnet="xxx")

注意：

• attrs 是非标准的（非数据流传递的），非 html 控件默认向可以用 attrs , 所以请不要滥用 attrs !
• 类似原生 js, 使用 $attrs 属于一种穿透( fallThrough )的行为