微信小程序中image组件src路径拼接字符串的问题
最近在做微信小程序毕设,涉及到远程图片显示,一开始我是这样写的:
index.js文件中
onLoad: function () {
this.setData({
imgurl:app.globalData.imgurl
})
}
index.wxml文件中
但是控制台老是报错说找不到本地图片:
VM12083:1 Failed to load local image resource /pages/index/index/images/2020/03/26%2021:24:17/158522905776945.png
the server responded with a status of 500 (HTTP/1.1 500 Internal Server Error)
先说解决方法:
1.可以在imgurl初始化的时候就赋值
index.js
data: {
imgurl: getApp().globalData.imgurl
}
index.wxml
2.可以在标签中做判断
我选择的是第一种,然后完美解决了,没有报错了。
接下来简要说一下为什么会报错:
看一下报错信息,说本地不存在images/2020/03/26%2021:24:17/158522905776945.png .png这个文件。也就是说页面在执行onLoad之前就已经渲染了,这个时候imgurl值为空字符串,image的src拿到的图片链接就是/images/2020/03/26%2021:24:17/158522905776945.png ,image标签就以为这是本地图片导致的。