uniapp中slot插槽的使用

插槽主要实现分发，当父组件引用带有插槽的子组件时，引用处的子组件内如有内容，当组件渲染的时候， 将会被替换

1、默认插槽的使用：

slot-one组件：

父组件引用slot-one组件：

 效果：

2、插槽内可以包含任何模板代码，包括 HTML：

slot-one组件如上不变。

父组件引用slot-one组件：

    
      插槽内可以包含任何模板代码，包括 HTML
    

效果：

3、插槽内可以包含其它的组件,下面的内容来自slotTwo组件：

slot-one组件如上不变，slot-two组件：

父组件引用slot-one组件，slot-one包含slot-two组件：

  
    
      插槽内可以包含其它的组件,下面的内容来自slotTwo组件
      
    
  

 效果：

4、后备内容：

• 有时为一个插槽设置具体的后备 (也就是默认的) 内容是很有用的，它只会在没有提供内容的时候被渲染,
• 但是如果我们提供内容,则这个提供的内容将会被渲染从而取代后备内容

slot-one组件（带有默认值）：

父组件引用slot-one组件：

  
    
    

    
      提供的内容将会被渲染从而取代后备内容
    
  

 效果：

 

5、具名插槽：

• 有时我们需要多个插槽, 元素有一个特殊的 attribute：name，语法： ，用来定义额外的插槽
• 一个不带 name 的 出口会带有隐含的名字“default”
• 在向具名插槽提供内容的时候，我们可以在一个