taro 小程序 CoverImage Image src无法显示图片的问题

目录

一、问题描述

二、解决方案


一、问题描述

使用taro开发的微信小程序图片无法正常显示,并报如下错误:

渲染层网络层错误\] Failed to load local image resource /assets/icon/message.png the server responded with a status of 500 (HTTP/1.1 500 Internal Server Error)

此时的代码如下:

javascript 复制代码
      <CoverView>
        <CoverImage src={"/assets/icon/home.png"}/>
      </CoverView>

可以看到,我直接采用了web项目的相对路径写法,直接写路径是有问题的。

二、解决方案

经过查阅资料,了解到小程序项目里图片的src只能是以下两种类型的方式使用:

1、网络在线图片地址;

2、而本地图片,并且在项目中引入以后,

将上面的代码改成正确的方式如下:

javascript 复制代码
import "@/assets/icon/home.png";

......

    <CoverView>
        <CoverImage src={"/assets/icon/home.png"}/>
      </CoverView>

这样在项目中引入以后就OK了!的确是一个比较坑的点。

相关推荐
jingling55512 小时前
uniapp | 快速上手ThorUI组件
前端·笔记·前端框架·uni-app
一枚前端小能手12 小时前
🔥 滚动监听写到手抽筋?IntersectionObserver让你躺平实现懒加载
前端·javascript
遂心_12 小时前
React中的onChange事件:从原理到实践的全方位解析
前端·javascript·react.js
GHOME12 小时前
原型链的原貌
前端·javascript·面试
luckyCover12 小时前
带你一起攻克js之原型到原型链~
前端·javascript
麦当_12 小时前
SwipeMultiContainer 滑动切换容器算法指南
前端·javascript·算法
用户315063273048712 小时前
使用 vue-virtual-scroller 实现高性能传输列表功能总结
javascript·vue.js
前端小巷子13 小时前
JS打造“九宫格抽奖”
前端·javascript·面试
老华带你飞14 小时前
畅阅读小程序|畅阅读系统|基于java的畅阅读系统小程序设计与实现(源码+数据库+文档)
java·数据库·vue.js·spring boot·小程序·毕设·畅阅读系统小程序
GISer_Jing14 小时前
React 18的createRoot与render全面对比
前端·react.js·前端框架