使用setData进行页面列表数据渲染,每次使用setData更新数据列表回滚至顶部,求解决办法?
需求是删除订单列表得某个订单,不管删除哪条订单,页面都会立马回弹至顶部,想要的效果是删除这条订单时页面定位在原地,感觉是setData得原因,请问是否有更好得解决方案
data: {
orderstate: 0,
orderCaching: [
{ id: 0, tabs: '全部', list: [], page: 1, isloaded: true },
{ id: 1, tabs: '待付款', list: [], page: 1, isloaded: true },
{ id: 2, tabs: '待发货', list: [], page: 1, isloaded: true },
{ id: 3, tabs: '待收货', list: [], page: 1, isloaded: true },
{ id: 4, tabs: '已完成', list: [], page: 1, isloaded: true },
],
bottomload: false,
},
comfireRemove() { // 删除请求
app.request("order/order_delete", { order_id: this.data.removeid }).then(res=>{
if (res.status == "success") {
let orderCached = this.data.orderCaching, resindex = this.data.removeindex
orderCached[this.data.orderstate].list.splice(resindex, 1)
this.setData({ orderCaching: orderCached }) // 此处进行列表数据更新
wx.showToast({
title: '删除成功!',
icon: 'success',
duration: 2000
})
} else {
wx.showToast({
title: '删除失败!',
icon: '/img/error.png',
duration: 2000
})
}
})
},
请问对此是否有更好得交互逻辑
3 回复
注意看,你的不同项的列表值被放到了orderCaching的不同项中,所以要单独对单个列表setData,只需改一句即可。
this.setData({ orderCaching: orderCached })
改成
this.setData({ ['orderCaching[' + this.data.orderstate + '].list']: orderCached[this.data.orderstate].list })
你好,请提供能复现问题的简单代码片段
https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html
--↓↓👍如果觉得有帮助的话请点个【赞】吧(唏嘘也有小尾巴了,可惜是假的)