有朋友遇到wx:for渲染的列表在iPhone X上面会出现重复渲染最后一条数据的问题吗？
使用工具：
wepy 1.7.2
问题简介：
在页面来回切换过程中才会出现，且目前只在iPhone X上发现（见附1）；
接口返回的数据没问题，但是渲染时只渲染接口返回的数据中的最后一条。
排查过程：
尝试使用onHide() 和 onUnload()在页面切换时将渲染的数组清空，但这样又出现了新的问题，渲染出来的图片会花屏（见附2）；
尝试去掉animate.css动画，仍然出现；
尝试将background-image改为绝对布局的image，仍然出现。
涉及的代码：
wxml:
<view class="albumChoiceOuter"> <scroll-view upper-threshold="50" scroll-y bindscrolltolower="imLower" bindscrolltoupper="scrollUp" class="albumChoice box"> <view wx:if="{{albumList.length!=0}}" wx:for="{{albumList}}" catchtap="jumpToGuess({{item}})" wx:key="index" class="albumLine box" style="background-image: url('{{item.bg_img}}')"> <view class="topBox"> <view class="topTitle"> <text class="albumName">{{item.name}}</text> <text class="albumDesc">{{item.description}}</text> </view> </view> <view class="line"></view> <view class="bottomBox"> <view class="block left"> <text class="scoreName">最好成绩</text> <text class="scoreValue">{{item.max}}</text> </view> <view catchtap="jumpToRank({{item.id}})" class="block right"> <text class="scoreName">挑战次数</text> <text class="scoreValue">{{item.count}}</text> </view> </view> </view> </scroll-view> <text wx:if="{{isSlided==false}}" class="slideTips">滑动还有更多哦！</text> <text wx:else class="slideTips">到底啦</text> </view> |
js:
getIndex() { wepy.showLoading({ title: '加载中...', //提示的内容, mask: true, //显示透明蒙层，防止触摸穿透, success: res => {} }); api.getIndex({ openid: this.userInfo.openid, page: 1, /* 第几页歌单，默认1 */ page_size: 100, /* 每页多少歌单，默认10 */ // game_type: 2, }).then((result) => { console.log(result) if (result.errorCode == 0) { setTimeout(()=>{ this.albumList = result.data.song_list this.$apply()
wepy.hideToast(); } }).catch(err=>{ console.log(err) })} |
附1：
附2：
正常渲染时：
已解决，解决办法见我的笔记。普通H5同样也有这种问题（主要出现在iPhone X及以上部分机型，部分是因为也有发现iPhone X兼容filter属性的情况，是的没错俺测试了n台iPhone X设备）
小程序踩坑记之——花屏/重复渲染数据
你好，请提供一下出现问题的机型和微信版本，以及能复现问题的简单代码片段（https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html）。
你好，已解决。
<blockwx:for="{{list}}"><view>...... 其他节点...</view></block>您有H5网页遇到过此问题吗，怎么解决？我们现在是跟您问题一样花屏，也有加载同一条数据的情况。