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

相关推荐
烛阴2 分钟前
告别原生Cookie:js-cookie如何实现Cookie的优雅管理
前端·javascript
汪子熙1 小时前
走进 Fundamental NGX Platform:从 SAP 设计体系到高生产力组件层
前端·javascript·面试
拉不动的猪1 小时前
单点登录全流程小姐
前端·javascript·面试
y东施效颦2 小时前
uni-app页面发布测试环境出现连接服务器超时,点击屏幕重试解决方案
前端·javascript·vue.js·uni-app·vue
秋田君2 小时前
深入理解JavaScript设计模式之单例模式
javascript·单例模式·设计模式
摸鱼仙人~2 小时前
React中子传父组件通信操作指南
前端·javascript·react.js
程序员阿超的博客2 小时前
React事件处理:如何给按钮绑定onClick点击事件?
前端·javascript·react.js
甜甜的资料库3 小时前
基于微信小程序的睡眠宝系统源码数据库文档
数据库·微信小程序·小程序
前端小咸鱼一条3 小时前
Vue中渲染函数的使用
javascript·vue.js·ecmascript
郑州小张3 小时前
前端解析PDF文件目录以及点击目录实现对应内容预览
前端·javascript