Vue slot 插槽灵活使用

说明: 常见语法请到官网查看, 本文收录不常见的用法

可内嵌

slot插槽可以向<div>标签一样内容使用
例如:

<slot name="tableHeader">
      <el-header
        v-show="showHeader"
        style="height: 50px;"
        class="page_header"
        :style="[{borderColor: (handleBar.bottomLine.visible?'ebeef5':'#fff')}]"
      >
        <slot name="tableHeaderTitle">
          <h3 class="title">{{ $route.meta.title }}</h3>
        </slot>
        <section class="page_handler">
         ....
        </section>
      </el-header>
    </slot>