VUE初长成【vue 作用域插槽】
父组件可通过插槽prop访问子组件中才有的数据
解构插槽中的定义后备内容,用于插槽 prop
是 undefined
的情形
在子组件中的
user
应为未绑定的prop
,如果绑定user
会报错
子组件:
<slot>
{{ user.firstName }}
</slot>
父组件:
用
v-bind
在子组件上无效,用#default
代替v-bind
即可
<current-user #default="{ user = { firstName: 'Guest' } }">
{{ user.firstName }}
</current-user>
v-bind
在template
上有效,#default
/v-bind
均可
<current-user>
<template v-slot="{ user = { firstName: 'Guest' } }">
{{ user.firstName }}
</template>
</current-user>