插槽作用域
让插槽内容能够访问子组件中才有的数据
-
在一个组件(设定组件是User)设定插槽时，在插槽上绑定数据
<template> <slot v-bind:user="user"> {{ user.name }} </slot> </template> <script> export default { props: { user, } } </script> -
使用绑定在插糟上的数据
// 普通写法 <user> <template v-slot='user'> {{user.name}} </template> </user> // 独占默认插槽的缩写语法 <user v-slot:default="slotProps"> {{ slotProps.user.firstName }} </user> <user v-slot="slotProps"> {{ slotProps.user.firstName }} </user>注意默认插槽的缩写语法不能和具名插槽混用，因为它会导致作用域不明确
只要出现多个插槽，请始终为所有的插槽使用完整的基于
<template>的语法
