Vue 中的区别:
Vue中的 a t t r s 和 attrs和 attrslistener
Vue-- a t t r s 与 attrs与 attrslisteners的详解

在 vue 中,对于在父组件中传递的属性,

若在子组件中使用@Prop声明了属性如@Prop name,则 name 属性只会在 this. p r o p s 中 出 现 , 不 会 出 现 在 t h i s . props 中出现,不会出现在 this. propsthis.attrs 中;

若在子组件中没有使用@Prop声明属性,则属性会默认在 this. a t t r s 中 , 不 会 出 现 在 t h i s . attrs 中,不会出现在 this. attrsthis.props 中;

故一般用 this.$attrs 接收处理没有用 @Prop 声明的属性,但一般不推荐这样,尽量使用 @Prop 声明所有自定义的属性,便于管理。

在 html 中的区别:
HTML中的attribute属性和JavaScript中的property属性的详解以及区别

props 是父类向子类传递并且需要子类主动接收的属性;

attrs 默认是父类传递到子类根元素的属性,子类不用主动接收,会直接放在子类根元素上。

而 attrs 的这种默认行为,可以通过设置 inheritAttrs 到 false,这些默认行为将会被去掉。而通过 (同样是 2.4 新增的) 实例属性 a t t r s 可 以 让 这 些 特 性 生 效 , 且 可 以 通 过 v − b i n d ( v − b i n d = " attrs 可以让这些特性生效,且可以通过 v-bind (v-bind=" attrsvbindvbind="attrs")显性的绑定到非根元素上。

Logo

前往低代码交流专区

更多推荐