首先这里不得不吐槽下小程序的数组更新,间接通过 setData
替换整个数组只在开发者工具上有成果,放到真机上就齐全失灵,这是一件很蛋疼的事件,不晓得小程序官网团队的更新机制是什么,也没有去细看,猜想可能与援用类型有关系。
看了网上大都是指定批改数组对象里的某个元素值,如这样:
Page({ data: { list: [{name: 'tom'}] }, onLoad() { this.setData({[`list[0].name`]: 'jack'}) }})
PS:感觉这样解决十分麻烦,须要一个个遍历去解决,而且新数组与旧数组的长度可能还不一至,还要比照,想想就放弃了,也没真正测试进去成果来。
因为要做的是一个简略的页面,只有地图和列表,所以就另辟蹊径通过 redirectTo
去解决了,其就是想通过刷新页面去实现视图更新的,因为小程序没有间接的刷新页面API,所以就想着通过 reLaunch
或 redirectTo
间接实现,不过 reLaunch
没成果,所以就确定了 redirectTo
加上参数实现的视图更新,说到这,其实这个和数组更新没有关系了,不过这的确是因为数组更新没成果引起的血案,只能通过其余形式来救场,相应的示例代码:
Page({ data: { activeTab: '', list: [] }, onLoad(options) { if(options.tab) { this.setData({activeTab: options.tab}) } this.getList() }, changeTab(e) { wx.redirectTo({url: `/pages/index/index?tab=${e.currentTarget.dataset.tab}`}) }, getList() { wx.request({ url: 'xxx', data: { tab: this.data.activeTab }, success: res => { this.setData({list: res.data}) } }) }})
最初尽管问题侧面解决了,但这不是正规的解决形式,而且有场景限度,所以还是心愿官网看看是否优化数组的更新机制。
更多前端常识,请关注小程序,不定期有惊喜!