vm.$attrs

官方：包含了父作用域中不作为 prop 被识别 (且获取) 的特性绑定 (class 和 style 除外)。当一个组件没有声明任何 prop 时，这里会包含所有父作用域的绑定 (class 和 style 除外)，并且可以通过 v-bind="$attrs" 传入内部组件——在创建高级别的组件时非常有用。

场景:当有多级组件时，我们希望最底层组件能够获取顶层数据时，如果使用prop来获取，那显得非常繁琐，需要一级一级的prop。
vue提供了 v-bind="$attrs"，子组件添加v-bind="$attrs",子孙组件通过 $attrs就能获取到想要的属性。

   <div id="attrs-test">
        <son :book="book" :content="content" :price="price"></son>
     </div>
       <script>
           Vue.component('son', {
               props:['book'],
               template:`
               <div>
               <p>书名:{{book}}</p>
               <grandson v-bind="$attrs">
                   </grandson>
               </div>
               `
           })
           Vue.component('grandson', {
               template:`<div>
               <p>内容:{{$attrs.content}}</p>
               <p>价格:{{$attrs.price}}</p>
               </div>`
           })
           new Vue({
               el:"#attrs-test",
               props:[],
               data:{
                   book:'《JavaScript高级程序设计》',
                   content:'JavaScript最新经典教程 * Amazon超级畅销书 * AJAX程序员必备',
                   price:'￥59.00'
               }
           })
       </script>

结果：