uni-app image标签图片不显示

uni-app image标签图片不显示

操作步骤：

  • 图片不显示

预期结果：

  • 图片显示

实际结果：

  • 图片不显示

bug描述：

  • image标签 图片不显示 如下图 报错

image image

项目信息

信息 值
产品分类 uniapp/H5
PC开发环境 Windows
操作系统版本 win10
HBuilderX类型 正式
HBuilderX版本 3.1.2
浏览器 Chrome
浏览器版本 内置浏览器
项目创建方式 HBuilderX

更多关于uni-app image标签图片不显示的实战教程也可以访问 https://www.itying.com/category-93-b0.html

2 回复

试试绝对路径呢

更多关于uni-app image标签图片不显示的实战教程也可以访问 https://www.itying.com/category-93-b0.html


根据你提供的截图和项目信息，图片不显示的主要原因是路径问题。图片路径使用了相对路径../../static/logo.png，但在uni-app中，静态资源引用需要注意以下几点：

  1. static目录的特殊性：static目录下的文件会被直接拷贝到打包目录，引用时应该以绝对路径/static/开头，而不是相对路径

  2. 正确的图片引用方式：

    <image src="/static/logo.png"></image>

    或者使用require方式：

    <image :src="require('../../static/logo.png')"></image>
回到顶部