一起养成写作习惯!这是我参与「掘金日新计划 · 4 月更文挑战」的第2天,点击查看活动详情。
问题描述
情况是这样的昨天在写小程序的时候,我进行图片进行循环出来,但是出现渲染层网络层报错,我以为是图片的地址出现了问题,经过打印是完全可以进行循环的。(如图下图)
既然没有语法错误,为什么会报错呢?请看如下解决方案
解决方案
开发者社区修改报错的方法是
<image wx:if="{{item.image_src}}" src="{{item.image_src}}"></image>
在看到开发者社区后,好多是这样改了后, 认为是防盗链的原因,但是进行修改了后还是进行报错。
调试版本库
因为异步请求需要一定的时间,而小程序一进页面就开始加载,请求速度没跟上,这时页面显示加载的时候image里面的值是空的,就会出现渲染层、网络层错误,所以既然是加载速度的原因,我们完全可以让其完全加载完成之后在显示,所以我们可以通过拖延加载时间的方法来解决这个bug。
在开发环境基本信息一部分中,我们已说明上述报错代码所依赖的调试基础库版本信息,这里我们不需要修改任何代码,只需要修改一下版本信息即可让代码跑通
总结
开发者工具调试器-console中的渲染错误 要注意,load image resource 有问题,排查思路,查图片路径是否有效
理解了前端 一个图层的无法加载,不影响这个页面其他的渲染。深刻理解了图层的概念