v-slot的用法(代替slot和slot-scope)

v-slot的用法(去除了slot和slot-scope)

• 具名插槽
  根组件

  <div id="app">
    <Son>
      <template v-slot:name>
        <span>替换了span>
      template>
    Son>
  div>

子组件

    <div>
      我是子组件
      <slot name="name">我是默认名称:{{name}}slot>
    div>

• 作用域插槽

  <div id="app">
    <Son>
      <template v-slot:son="msg">
        <span>{{msg}}span>
      template>
    Son>
  div>

    <div>
      我是子组件
      <slot name="son" :data="name">我是默认名称:{{name}}slot>
    div>

• 将以前的简化了一些，替换了slot、slot-scope，2.6.0+ 就废弃了这两个指令
• 具名插槽：v-slot:子组件插槽的name
• 作用域插槽：v-slot:子组件的插槽name=“自定义名”配合子组件的插槽上的属性:自定义="变量"