官方文档说明:
解释:包含了父作用域中不作为 prop 被识别 (且获取) 的特性绑定 (class 和 style 除外)。
意思就是父组件往子组件传没有在props里声明过的值时,子组件可以通过$attrs接受,且只包含父组件没有在props里声明的值。
父组件
<template>
<div class="home">
<child gender="male" age="18"/>
</div>
</template>
<script>
import Child from '../components/Child'
export default {
name: 'home',
components: {
Child,
}
</script>
子组件
<template>
<div>
-----------------Child------------------
<br>
<span>gender: {{$attrs['gender']}}</span>
<br>
<span>age: {{$attrs['age']}}</span>
<br>
</div>
</template>
<script>
export default {
name: 'Child'
}
</script>
<style>
</style>
结果图: