Vue中的$attrs和$listeners

Vue中的 $attrs 和 $listeners

最近在研究 Vue 的组件库，之前也用过 $attrs 和 $listeners，官方文档描述的不太详细，也没有太好的例子，就没有深入的研究过这两个属性。最近生病在家，正好有时间好好研究一下 Vue 的高阶用法，写了几个 demo，下面我们来看看这两个属性到底有什么奥秘。

$attrs

我们先来看看官方文档的 api 描述是怎样描述 $attrs 的

乍一看可能有点懵，下面我们结合下面的例子来看看 $attrs 的作用

普通的 props 传值

先来看看下面的例子，我自己写了一个双向绑定的 input 的组件，来验证一下。

<!-- 父组件 -->
<mxx-input v-model="user.username" type="text" foo="foo"></mxx-input>

<!-- 子组件 -->