Vue $attrs和$listeners的使用

A父、B子、C孙

组件传值的时候会用到A组件在B组件传递值，B组件会通过 $attrs获取到不在B组件props里面的所有属性，B组件通过在C组件上绑定 $attrs 和 $listeners 使C组件获取A组件传递的值并且可以调用在A组件那里定义的方法

多级组件嵌套需要传递数据时，通常使用的方法是通过vuex。但如果仅仅是传递数据，而不做中间处理，使用 vuex 处理，未免有点大材小用。为此Vue2.4 版本提供了另一种方法-- $ attrs/ $listeners

$ attrs：包含了父作用域中不被 prop 所识别 (且获取) 的特性绑定 (class 和 style 除外)。当一个组件没有声明任何 prop 时，这里会包含所有父作用域的绑定 (class 和 style 除外)，并且可以通过 v-bind="$attrs" 传入内部组件。通常配合 interitAttrs 选项一起使用。

$ listeners：包含了父作用域中的 (不含 .native 修饰器的) v-on 事件监听器。它可以通过 v-on="$listeners" 传入内部组件
例子：

// A组件
<template>
  <div class="home">
      <el-link type="primary" @click="change">测试vuex修改参数，其他页面响应式改变</el-link>
    <!-- $attrs和$listeners -->
    <Son :name="name" @change="change">&l