简单简洁的在 vue 中使用 slot 插槽

1. 匿名插槽 - 不需要 name 标识

子组件中定义 slot：

  <div class="nav-title">
     <!-- <slot>有默认值</slot> -->
      <!-- 没有默认值 -->
     <slot></slot>
  </div>

说明一下：如果父组件有值传递过来，就使用父组件的值；如果没有，就默认使用子组件中设置的默认值，默认值可以为空。

父组件中赋值传递：

   <backNav>
      <slot>修改密码</slot>
   </backNav>

2. 具名插槽 - 需要 name 标识

子组件中定义 slot：

  <div class="nav-title">
  		<slot name="btn-title"></slot>
  </div>

父组件中赋值传递：

   <backNav>
       <span slot="btn-title">申请信息详情</span>
   </backNav>

注意对比子组件以及父组件中的 name 与 slot 值和位置

这样子，一个完整的 slot 插槽就使用结束了。