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了!的确是一个比较坑的点。

相关推荐
灵感__idea5 小时前
JavaScript高级程序设计(第5版):好的编程就是掌控感
前端·javascript·程序员
说私域7 小时前
公域流量向私域流量转化策略研究——基于开源AI智能客服、AI智能名片与S2B2C商城小程序的融合应用
人工智能·小程序
半生过往7 小时前
微信小程序文件下载与预览功能实现详解
微信小程序·小程序·notepad++·压缩包下载解压
源码_V_saaskw7 小时前
JAVA图文短视频交友+自营商城系统源码支持小程序+Android+IOS+H5
java·微信小程序·小程序·uni-app·音视频·交友
hui函数8 小时前
掌握JavaScript函数封装与作用域
前端·javascript
Carlos_sam8 小时前
Opnelayers:ol-wind之Field 类属性和方法详解
前端·javascript
小毛驴8508 小时前
创建 Vue 项目的 4 种主流方式
前端·javascript·vue.js
你这个年龄怎么睡得着的10 小时前
Babel AST 魔法:Vite 插件如何让你的 try...catch 不再“裸奔”?
前端·javascript·vite
我想说一句10 小时前
掘金移动端React开发实践:从布局到样式优化的完整指南
前端·react.js·前端框架
weixin_lynhgworld10 小时前
淘宝扭蛋机小程序系统开发:重塑电商互动模式
大数据·小程序