深入理解vue中slot与slot-scope的具体使用(4)

日期：2020-05-11 栏目：程序人生 浏览：次

子组件：

<template>
 <div class="child">

 <h3>这里是子组件</h3>
 // 作用域插槽
 <slot :data="data"></slot>
 </div>
</template>

 export default {
 data: function(){
  return {
  data: ['zhangsan','lisi','wanwu','zhaoliu','tianqi','xiaoba']
  }
 }
}

结果如图所示：

github

以上三个demo就放在GitHub了，有需要的可以去取。使用非常方便，是基于vue-cli搭建工程。

地址点这里

最后

希望本文所述对你有所帮助，vue中slot与slot-scope的具体使用就给大家介绍到这里了。希望大家继续关注我们的网站!