A页面跳转到B页面,B页面需要需要更新A页面的Data中的值。
我的小程序是从微信小程序转成uniApp的,A页面展示照片,到B页面拍照完成拍照后将A页面照片更新,并在A页面调用接口提交到后台。现象:B页面拍照后回A页面,A页面照片显示已经更新了,看调试后台发现data中的值也更新了。调用接口时也报成功,结果发现A页面图片没有更新到数据库,重新进入A页面时照片还是旧的。经排查发现,上传图片前打印出的图片路径还是旧的路径。
问题代码
var prevPage = pages[pages.length - 2]
prevPage.setData({
tempFilePaths: imgPath,
});
经网上查找问题后修改为以下代码,解决问题
var prevPage = pages[pages.length - 2]
prevPage.$vm.tempFilePaths = imgPath;
$vm使用说明
https://uniapp.dcloud.net.cn/api/window/window.html#vm
大部分人都知道小程序需要调 setData才会修改变量触发更新页面,直接this.data.selected = true,这样是不会更新UI的。这次反向问题,我还是没搞清楚到底为何会这样,这明显不是页面还没渲染完$nextTick()就去取值造成的,有知道原理的大神希望能给我指点迷津。
写完这个让我想到了以前代码review时同事说不要取UI状态作为判断条件,说UI不靠谱,应该是数据驱动页面,也就是需要用数据判断,比如我们在编程时可能为了少声明一个变量,会直接用按钮是否选中作为判断条件。例如
var btn = new Button()
if(判断逻辑) {
btn.seleced = true
}
if(btn.isSelect) { // 执行按钮选中时的一些操作,这样就存在上面提到的bug
}
var btn = new Button()
var isBtnSelected = false
// 例如接口响应后经过判断改变按钮的选中状态
isBtnSelected = 判断条件
btn.seleced = isBtnSelected
以前不能理解,也按leader说的做了,虽然感觉说的对,但是心想通过UI状态做判断条件应该也没啥问题。本次经历让我有了深刻的认识,还有一些编程人员又菜又犟,告诉他的坑他不信邪非得自己踩一遍。