09.有条件的渲染插槽

这节课，我们来看下有条件的渲染插槽。首先，我们来看个例子。

我们知道，每个 Vue 组件都 有一个特殊的对象 $slots，默认插槽的 key 是 default，其它命名插槽的 key，就是插槽的名称。

我们来看个例子，假设，有一个 User 组件，内容如下：

// User.vue




1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

在 User 组件中，我们声明了两个插槽，一个是默认 ，还有一个命名插槽 header。然后，在组件挂载的时候把当前组件的 $slots 打印出来。

接着，在父组件中，我们引入一个 User 组件，内容如下：