微信小程序 模板和插槽的组合实现弹框

1. 熟悉插槽语法
2. 熟悉模板语法
3. 效果如下:

4.源码地址：developers.weixin.qq.com/s/r6X33fmN7… 5.插槽的使用

组件 component
<!-- 组件模板 -->
<view class="wrapper">
  <view>这里是组件的内部节点</view>
  <slot></slot>
</view>

<!-- 引用组件的页面模板 -->
<view>
  <component>
    <!-- 这部分内容将被放置在组件 <slot> 的位置上 -->
    <view>这里是插入到组件slot中的内容</view>
  </component>
</view>

6.模板的使用

<template name="msgItem">
  <view>
    <text> {{index}}: {{msg}} </text>
    <text> Time: {{time}} </text>
  </view>
</template>

<template is="msgItem" data="{{...item}}"/>