在使用vant组件制作微信小程序项目时,遇到了图片解析不到的问题。
场景如下:
在页面中,应用了vant组件库中的van-card,组件中将图片路径传给van-card中的thumb属性,即可在左侧位置显示出图片,目标效果如下:
这时遇到了解析不到图片的问题。
在card组件中,thumb中传递的图片路径并不是对于本页面的相对位置,而是/miniprogram_npm/@vant/weapp/card的相对位置,从组件目录中解析图片。
随后,我在目录某个位置创建了myImage文件夹,并且通过正确的图片路径找到图片进行解析,但却出现了以下报错(图片路径已经多次检查,无误)
经过多层尝试,最终发现了问题:
当创建的图片文件夹在weapp路径以下时,图片可以成功解析。
但是当创建的图片文件夹在weapp路径以外时,图片解析会发生上图所示报错。
最后附录van-card的部分,成功运行显示的代码:
js部分:
data: {
activeKey:0,
goods:[