vue中使用v-bind=“$attrs“进行多层组件的传值

有如下的嵌套关系

<grandfather>
	<father>
		<grandson>
		</grandson>
	</father>
</grandfather>

• 比如说在grandfather中传给了father一些props

grandfather.vue

<div>
	<father
	name="test"
	age="18"
	hobby="badminiton"
	grade="3"
	>
	</father>
</div>

• 然后在father接收一些想要的值

father.vue

<div>
	<grandson v-bind="$attrs">
	</grandson>
</div>


props: {
      name: {
        type: String,
        default: 'default'
      },
      age: {
        type: String,
        default: 'default'
      }
    }
注意这里并没有接收hobby和grade这两个值
那么这两个未被father接收的值就可以通过v-bind="$attrs"
传递给grandson了

• grandson接收一些father没有接受的值

  props:{