Vue3中的组件attrs元素属性继承

组件attributes元素属性继承

attrs元素属性继承

比如，当一个组件以单个元素为根做渲染时，父组件添加到子组件上的HMTL属性值，如class、id、style元素属性等，会直接自动合并添加到子组件模板的根元素上，这就是属性继承。看如下例子：

    <!-- MyButton.vue -->
    <template>
        <button > click me </button>
    </template>

    //App.vue
    <template>
      <MyButton class = "large" />
    </template>

渲染之后的结果：

    <button class="large">click me</button>

如果button元素本身包含class属性，如class=‘btn’，则会将组件中的class属性合并到根元素button的class属性中：

    <button class="btn large">click me</button>

v-on元素事件监听器继承

属性继承规则同样适用于v-on事件监听器：