微信小程序swiper数据动态

关于微信小程序swiper内容动态渲染不显示问题,请各位指点一二

index.wxml的代码是

<view class="aHeight">
          <!-- 内容 -->
          <swiper style="height:1000rpx;"  bindchange="handleSwiperChange" current="{{currentTab}}">
            <swiper-item wx:for="{{article}}" wx:key="index">
            
                <view  class="view-list">
                    <view class="view-item" wx:for="{{item.data}}" wx:for-item="items" wx:for-index="i" wx:key="i" bindtap="GoToContent" data-id="{{items.id}}">
                    <image src="{{items.thumbnail}}" mode="aspectFill"/>
                    <view class="mask"></view>
                    <view class="location">
                      <view class="name">{{items.title}}</view>
                      <view class="position">
                        <image src="../../images/local.svg" mode=""/>
                        <view>
                          {{items.location}}
                        </view>
                      </view>
                    </view>
                  </view>
              </view>
            </swiper-item>
          </swiper>
        </view>

article的数据为

img

运行结果:

第一个数据渲染:

img

第二个数据渲染:

img

我的思路是通过article的4个数据进行循环生成四个swiper-item然后对article下的data的四个数据再循环一次生成四个view的item,第一个数据是能渲染出来的,然后第二个数据却渲染不了

检查一下数据,代码看着没啥问题。其实可以使用vant组件代替 地址