vue $attrs与$listeners

在组件多级嵌套的情况下，相互间的传值是这样的呢 ？

A 根组件
B 子组件
C 孙组件
...

在很多开发情况下，我们只是想把A组件的信息传递给C组件，如果使用props 绑定来进行信息的传递，虽然能够实现，但是代码并不美观。

在vue2.4中，为了解决该需求，引入了 $attrs 和 $listeners ， 新增了inheritAttrs 选项。

1. $attrs的使用

继承所有的父组件属性（除了prop传递的属性、class 和 style ）

注：使用 $attrs 时，所接收的值是不包含props里面值的。如下例，name与sex都用props接受，$attrs 接收的值将为 空，props 只接收name时，$attrs 只会有sex

// 父组件A 代码如下

// 子组件child-b 代码如下

// 孙组件child-c 代码如下

2. $listeners的使用

包含了父作用域中的 v-on 或 @ 事件监听器。它可以通过 v-on="$listeners" 传入内部组件

注：使用 $listeners时，不包含不含 .native 修饰器的。

// 父组件 A

// 子组件b

//在孙子组件c