Vue-特殊 attribute

• key
• ref
• is
• slot：推荐 2.6.0 新增的 v-slot。
• slot-scope：推荐 2.6.0 新增的 v-slot。
• scope：被 2.5.0 新增的 slot-scope 取代。推荐 2.6.0 新增的 v-slot。

 

被废弃的slot、推荐 2.6.0 新增的 v-slot：子组件可以向插槽传值

<template>
  <div>
    <show-data><h1 slot="name">mike</h1><h1 slot="age">0.5</h1></show-data>
  </div>
</template>
<script>

const ShowData = {
  template: '<div><slot name="name">张三</slot><slot name="age">长生不老</slot></div>'
}

export default {
  components: {
    ShowData
  }
}
</script>


// 推荐 2.6.0 新增的 v-slot。

<template>
  <div>
    <show-data><template v-slot:default>无</template><template v-slot:info="slotProps">{{slotProps.detail.name}}</template></show-data>
  </div>
</template>
<script>

const ShowData = {
  template: '<div><slot>哈哈哈哈</slot><slot name="info" :detail="userInfo"></slot></div>',
  data() {
    return {
      userInfo: {
        name: '张三'
      }
    }
  }
}

export default {
  components: {
    ShowData
  }
}
</script>