微信小程序使用本地图片在真机不显示的问题

最近做的小程序,在真机测试发现有些本地图片在开发工具上可以显示,但是在真机上预览的时候不能显示

代码是这样写的

<view class=‘seat-size‘ wx:for="{{item}}" wx:key="index" wx:for-index="index" wx:for-item="citem">
<image src=‘../../../images/seaticon.png‘ class=‘seat-img‘ />
</view>
最后发现路径这样写在真机上不识别,需要相对于根目录来写

<image src=‘/images/seaticon.png‘ class=‘seat-img‘ />

像这样就可以解决问题了。

如果不是路径问题,还有其他几种办法查找问题,从其他博主那采摘滴

1.图片是用image加载的;

2.图片的url里面没有中文;

3.图片的HTTP应为小写的http以及图片的后缀为小写的.png或者.jpg(建议全部为png)

4.域名已备案;

5.图片名称没有空格

原文地址:https://www.cnblogs.com/jianxian/p/11105368.html

时间: 2024-11-09 00:42:48

微信小程序使用本地图片在真机不显示的问题的相关文章

微信小程序解决存在图片太大而有效显示区域较小--阿里云oss产生缩略图

OSS是使用通过URL尾部的参数指定图片的缩放大小 图片路径后面拼接如下路径:     ?x-oss-process=image/[处理类型],x_100,y_50[宽高等参数] ?x-oss-process=image/resize,m_fill,h_高度,w_宽度,limit_0 //去除之前的参数,添加新的参数resp.list.map( item => { item.logo = item.logo.replace(/\?([0-9a-zA-Z/=_-]+)/g,'?x-oss-proc

微信小程序点击图片放大预览

微信小程序点击图片放大预览使用到 wx.previewImage 接口,可以放大.上/下一张 上代码 wxml代码 <view class='content-img' wx:if="{{images}}" > <view wx:for="{{images}}"> <image src="{{item}}" data-src="{{item}}" bindtap="previewImage

微信小程序开发本地数据缓存教程

微信小程序开发过程中,本地数据缓存是必不可少的一部分.而且本地数据缓存的用途还挺多的,下面木鱼小铺(https://www.muyu007.cn)就和大家分享一下微信小程序开发本地数据缓存教程,希望对大家有所帮助! 第一步:读写本地数据缓存 微信小程序为了方便开发者缓存数据提供了读写本地数据缓存接口,读本地数据缓存采用的是wx.getStorage/wx.getStorageSync接口,写本地数据缓存的是wx.setStorage/wx.setStorageSync接口.其中以Sync结尾的是

微信小程序——引入背景图片【六】

前言 之前写了一些小程序的博文只是看文档边看边写,了解下他,这次可是真枪真刀的做了! 框架使用的是美团的mpvue,我也是一边学习,一边写的,如有错误之处,还望大家指出. 在这里我有个问题,为什么微信小程序不支持css里面直接导入本地图片作为背景图呢? 内联式 <view class="img" style="background-image: url(/static/images/draw.png)"></view> 外部引入 如果css是

微信小程序插入背景图片(将图片转为base64)

关于在微信小程序中插入背景图片,是不能将本地文件直接作为background-image的,要么使用网址链接,要么使用base64,这,考虑到小程序的大小问题,毕竟大小限制为2M的小程序是不可能有多余的空间留给background-image的(准确地来说是在样式文件中需要使用图片时不能直接用本地文件,在wxml中可以?). 使用网址链接简单,直接找到需要的图片,一般右键都会有复制图片链接之类的 说一下将本地图片转为base64的操作(当然,并是不所有的图片转base64都合适,这比较适用于那个

微信小程序使用本地ip调试时报错解决方法

在微信小程序项目开发时,会用到本地调试,报错如下: 解决方法: 1.单击设置->项目设置 2.勾选该项即可. 原文地址:https://www.cnblogs.com/xindekaishi/p/12700768.html

微信小程序如何本地测试太阳码(二维码)分享功能

小程序如何在本地测试获取到太阳码(二维码)中的参数? 第一步:把生成的太阳码保存在本地. 第二步:在微信开发中工具中运行好项目然后选择添加编辑模式 第三步:选择上传文件, 上传之前保存的太阳码,上传过后就在启动参数中获取到了太阳码中的参数,然后点击确定 原文地址:https://www.cnblogs.com/maxiansheng/p/12512626.html

微信小程序 加载图片时,先拉长,再恢复正常

今天在写小程序,发现小程序的图片image如过mode设置为widthFix的话, 加载图片会被先拉伸,后恢复正常 我的处理方法是,给他一个初始的height值,或者就直接 height:auto 原文地址:https://www.cnblogs.com/bing0709/p/10729449.html

微信小程序踩坑日记4——真机端解析json数组和开发平台不一样

0. 引言 环境:访问服务器端php,获取json数组,并渲染在前台 问题描述:保证在开发平台上的正常运行,但是在真机端却出现了无法正确解析wx.request()返回的数据(特指无法解析res.data的json数组) 1. 解决方案 保证在开发平台的正确解析 问题自然而然引向了对string和json之间的转换问题,这里得益于这篇网友的博文. 但是,res.data在开发平台上显示的是object,而在真机端却显示的string,所以我们需要先判断开发平台,在转换类型. // 查看平台 wx