关于$attrs的继承

Question

按照vue文档里的代码敲出来的效果不一致；

Vue.component('base-input', {
  inheritAttrs: false,
  props: ['label', 'value'],
  template: `
    <label>
      {{ label }}
      <input
        v-bind="$attrs"
        v-bind:value="value"
        v-on:input="$emit('input', $event.target.value)"
      >
    </label>
  `
})

<base-input
  v-model="username"
  class="username-input"
  placeholder="Enter your username"
></base-input>

为什么class="username-input" 这个class会落在 label标签上 不是应该落在input上吗 求教了

Answer 1

看看官方文档vm.$attrs：

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

注意括号里面加粗的内容，$attrs并不包含class

Answer 2

为什么应该落在input上?label才是根元素 Class 与 Style 绑定