收藏
回答

swiper-item加载问题?

swiper通过请求的数据for循环出swiper-item,页面已经存在两个swiper-item并且swiper停留在第二个swiper-item时,刷新数据,渲染的swiper-item数据只有一个时,swiper-item渲染不出来,会形成一个空的节点在页面上,重新刷新数据,当数据为两个或两个以上时可以重新渲染出swiper-item,为一个时失踪渲染不出来

回答关注问题邀请回答
收藏

2 个回答

  • 兔兔🐰
    兔兔🐰
    2020-04-27

    这个问题将在后续的小程序版本中修复。对于之前版本的小程序,有一个临时的解决方案如下:


    1、WXML首先要绑定一个状态 current

    <swiper indicator-dots autoplay interval="5000" current="{{current}}">
      <swiper-item wx:for="{{list}}" wx:key="index" >
        <image src="{{item}}"></image>
      </swiper-item>
    </swiper>
    

    2、相应的,js里的data添加这个状态

      data: {
        list:[
          ......
        ],
        current: 0
      },
    

    3、在更新状态的时候,同时更新current (从0开始,必须是一个合法值)

    this.setData({
          list:[
            ...
          ],
          current: 0
        })
    
    2020-04-27
    有用
    回复 9
    • 浅风
      浅风
      2020-04-27
      我指定了是0木有用哇
      2020-04-27
      回复
    • 兔兔🐰
      兔兔🐰
      2020-04-27回复浅风
      可以提供代码片段吗?
      2020-04-27
      回复
    • 浅风
      浅风
      2020-04-27
      目前没写可运行的代码片,基本就是我截图那样的,问题跟提问的描述一样的
      2020-04-27
      回复
    • 兔兔🐰
      兔兔🐰
      2020-04-27回复浅风
      current要 绑定 到js的data里,然后在变更数据的时候重新更改这个状态。具体请看一下我的代码那里。
      2020-04-27
      回复
    • 浅风
      浅风
      2020-04-27回复兔兔🐰
      我绑定到js里面也是指定设置为0呀,不是一样的吗0.0
      2020-04-27
      回复
    查看更多(4)
  • 是小白啊
    是小白啊
    2019-12-11

    麻烦提供出现问题的具体机型、微信版本号、系统版本号,以及能复现问题的代码片段https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html

    2019-12-11
    有用
    回复 7
    • KimDot
      KimDot
      2019-12-11
      https://developers.weixin.qq.com/s/tsl5txma7ldW   请在到第二个item的时候再点击按钮
      2019-12-11
      回复
    • KimDot
      KimDot
      2019-12-11
      刚刚试了其他的情况,除了一个的情况外,只要不停留在第一个swiperitem下更改小于原有数据长度都会复现这个问题
      2019-12-11
      回复
    • KimDot
      KimDot
      2019-12-12
      请问有进展吗
      2019-12-12
      回复
    • 是小白啊
      是小白啊
      2019-12-12回复KimDot
      之前组件侧修复过了,这边再看下具体问题
      2019-12-12
      回复
    • KimDot
      KimDot
      2019-12-12回复是小白啊
      好的呢
      2019-12-12
      回复
    查看更多(2)
登录 后发表内容
问题标签