#$slots
类型：{ [name: string]: (...args: any[]) => Array<VNode> | undefined }仅可读
详细：
用来访问被插槽分发的内容。每个具名插槽有其相应的 property (例如：v-slot:foo 中的内容将会在 this.$slots.foo 中被找到)。default property 包括了所有没有被包含在具名插槽中的节点，或 v-slot:default 的内容。
在使用渲染函数书写一个组件时，访问 this.$slots 最有帮助。
示例：
<blog-post>
<template v-slot:header>
<h1>About Me</h1>
</template>
<template v-slot:default>
<p>
Here's some page content, which will be included in $slots.default.
</p>
</template>
<template v-slot:footer>
<p>Copyright 2020 Evan You</p>
</template>
</blog-post>
const app = Vue.createApp({})
app.component('blog-post', {
render() {
return Vue.h('div', [
Vue.h('header', this.$slots.header()),
Vue.h('main', this.$slots.default()),
Vue.h('footer', this.$slots.footer())
])
}
})
参考
`` 组件
通过插槽分发内容
渲染函数 - 插槽
页:
[1]