uni-app 小程序修改父页面数据,渲染正常,但js取值仍为旧数据?

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状态做判断条件应该也没啥问题。本次经历让我有了深刻的认识,还有一些编程人员又菜又犟,告诉他的坑他不信邪非得自己踩一遍。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容