vue——slot插槽

什么是插槽？

• 插槽就是子组件中的提供给父组件使用的一个占位符，用 表示，父组件可以在这个占位符中填充任何模板代码，如HTML、组件等，填充的内容会替换子组件的标签。

插槽内容

简单来说就是在父组件中给子组件模板，子组件直接可以通过使用。

• 在子组件left中放一个占位符

• 在父组件中给占位符填充内容

• 看一下效果

• 注释掉看一下效果

后备内容

简单来说就是插槽默认内容，它只会在没有提供内容的时候被渲染。

• 例如:在child组件中，我们可能希望这个 内绝大多数情况下都渲染文本“submit”。为了将“submit”作为后备内容，我们可以将它放在 内：

• 第一种情况：父组件中不提供任何插槽内容时后备内容“submit”将会被渲染：

显示的是后备内容

• 第二种情况：父组件中提供插槽内容，子组件代码不变，提供的内容将会被渲染从而取代后备内容：

显示的是父组件中提供插槽内容

具名插槽

简单来说就是通过slot的name属性来确定用那个插槽

• 如果一个组件里面有不同的插槽，我们该如果确定在什么地方使用哪个插槽呢，对于这样的情况， 元素有一个特殊的attribute：name。这个 attribute 可以用来定义额外的插槽（子组件）：

注意：不带 name 的 出口会带有隐含的名字“default”。

• 在向具名插槽提供内容的时候，我们可以在一个