因为要封装组件涉及到嵌套问题,发现小程序不能循环使用slot,烦死了。又要达到预期效果只能用虚拟节点,官网有介绍。
当前情景有A、B、C三个组件 展示在index.wxml中,A是最外层swiper组件,B是第二层scrollview组件,C就是需要渲染的内容。
由于C内容之前写的是分散的需要整理为一个组件 C组件,
index.json中 需要引入的组件有A和C,index.wxml :
<swiper组件
bind:myAction="getMyEvent"
data="{{data}}"
generic:selectable="C组件" />
A组件(swiper组件) wxml 例:
<view wx:for="swiperList" generic:selectable="swiper-item">
<scrollview组件 index="{{index}}">
<C组件 index="{{index}}" item="{{item}}" />
</scrollview组件>
</view>
A组件.json:
{
"component": true,
"usingComponents": {
"scrollview组件": "/components/scrollview组件/scrollview组件"
},
"componentGenerics": {
"selectable": true//要加上这个
}
}
B组件(scrollview组件) :
<scroll-view>
<view>
<slot></slot>
</view>
</scroll-view>