uniapp中image组件爬坑：如果src中含有反斜杠“\”会引起各种问题

最新推荐文章于 2024-06-30 19:44:42 发布
最新推荐文章于 2024-06-30 19:44:42 发布
阅读量3.3k 收藏 3
点赞数
分类专栏： vue 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Gabriel_wei/article/details/104707617
版权
前端 同时被 2 个专栏收录
183 篇文章 7 订阅
订阅专栏
vue
31 篇文章 2 订阅
订阅专栏

两个“\”转义

vue中的image如下
<image :src="paidImgUrl" mode=""></image>

paidImgUrl的值如下
paidImgUrl:"http://wjyz.hebau.edu.cn/YZCS/upload\\img\\fkjt\\146\\2.jpg",

页面渲染以后
在这里插入图片描述
实际地址是能拿到图的，但是在页面上面没有显示，他去获取的时候是这样的
在这里插入图片描述

里面的\被当成转义符了，不知道为什么，但是用chrome控制台审核元素的时候，确实能拿到。

解决

改用原生的img

Gabriel_wei
关注
专栏目录
5.uniapp中image属性用法
m0_49714202的博客
04-09 4706
1
c语言中双反斜杠的作用,有关c语言中的反斜杠 '\'
weixin_33942142的博客
05-16 4208
2020-02-02关键字：反斜杠趣谈稍微懂点编程的同学，甭管是哪种编程语言，都知道甚至是在代码中用过反斜杠。反斜杠这东西的最为人所知的作用就是作为“转义字符”以及“连接符”来使用。例如，常见的正则表达式用途：grep -nr "init*\.rc"以及在 c语言 领域常见的连接代码用途：#define LOG(a,b) do{\printf("[LOG]%d--%d", a, b); \}whi...
uni-app image组件将图像url里的反斜杠处理成乱码
weixin_48495574的博客
02-26 571
问题描述： 因后端返回数据问题url连接存在\反斜杠，然后图像没有渲染出来。 返回的url： 经过image组件渲染后的url： 反斜杠部分经过渲染后已成乱码。 解决方法： 修改返回的url把反斜杠修改为正斜杠 imageUrl.replace(/\\/g,"/"); //通过replace更换字符 ...
uniapp 图片 image src内容为变量时不显示图片解决方法。
最新发布
m0_74358570的博客
06-30 644
关于uniapp 图片（image）src内容为变量时不显示图片解决方法
微信小程序转uniapp：4）微信image等控件的src路径不匹配。
sziitjin的博客
11-18 1113
微信小程序转uniapp后，uniapp会自动创建一个static文件夹，并把微信原来的resources文件剪切到static文件下。 因此会导致原先image控件的路径无法找到对应的图片（其他资源文件同理），这时候需要手动修改一下。 修改前 <image src="/resources/images/a.png"></image> 修改后 <image src="/static/resources/images/a.png"></image>
【uniapp】如何在src中使用插值语法
ONLYSRY的博客
07-27 1506
page3img与page3text的值都是我们这边传过去的。
uni-app请求图片的路径是反斜杠如何解决
Xinacridine的博客
04-09 1152
uni-app做app项目的时候，请求到的图片链接路径有反斜杠，但是能在浏览器上打开，在页面就报错 页面显示之后报的错，实际上是能拿到照片的，因为里面的\被当成转义符了，被转义了 解决方法 this.bottom_img = res.data.data.bottom_img.replace(/\\/g,"/"); 可以使用.replace(/\\/g,"/");来改变图片路径。这样就能显示了 ...
URL中斜杠/和反斜杠\的区别小结
10-25
如果URL中错误地使用了反斜杠（\），那么图片可能不会正确显示。 在HTML代码中引用本地文件路径时，斜杠（/）和反斜杠（\）在大多数现代浏览器中也可以等效使用。例如，以下两个图片引用在现代浏览器中应该都能正常...
Python中的左斜杠、右斜杠(正斜杠和反斜杠)
12-23
首先，”/”左倾斜是正斜杠,”\”右倾斜是反斜杠,可以记为：除号是正斜杠一般来说对于目录分隔符，Unix和Web用正斜杠/，Windows用反斜杠，但是现在Windows （一）目录中的斜杠们 python读文件需要输入的目录参数，...
Nginx反斜杠自动解码问题解决方法
01-11
nginx 会对uri中的字符进行解码然后传递给fastCGI，一般情况下也无妨，偏偏我的搜索词中含有反斜杠，编码后的地址 代码如下: /search/Madmanfoo/Lovesong/ nginx传递给php的地址就变成了，我用的PATHINFO所以无法...
详解json串反转义（消除反斜杠）
12-13
JSon串在被串行化后保存在文件中，读取字符串时，是不能直接拿来用JSON.parse()解析为JSON 对象的。因为它是一个字符串，不是一个合法的JSON对象格式。例如下面的JSON串保存在...这个串如果出现在代码中是没有问题的
uni-app——uniapp 中 image src 网络图片和本地图片使用的区别
qq_43201350的博客
01-20 1470
uni-app——uniapp 中 image src 网络图片和本地图片使用的区别
解决uniapp跳转页面传递特殊符号参数的时候出现问题
weixin_46212682的博客
06-09 993
解决uniapp跳转页面传递特殊符号参数的时候出现问题
uniapp中如何使用image图片
精通前端技术，了解后端接口
12-26 6301
当在UniApp中使用图片时，可以通过标签将图片显示在页面上。这个标签可以指定src属性来引用图片，并且可以通过mode属性来设置图片的显示模式。除此之外，还可以利用@click事件来实现图片的点击事件。在编写代码时，要注意引用图片的路径和处理图片的点击事件，以及适配不同屏幕尺寸的情况。UniApp中的图片使用相对简单，下面的博客将详细介绍UniApp中图片的使用方法以及相关注意事项。
uniapp中的image的src=“路径”图片不显示
m0_64207574的博客
11-13 2842
uniapp中的image的src=“路径”图片不显示
关于使用 Element UI 的 el-image 组件导致本地图片不显示的问题
Alan_Walker688的博客
07-08 9859
当使用 el-image 在网页中加载本地图片时，会出现图片加载失败的问题，但使用 img 可以正常显示。
Vue项目中图片路径反斜杠问题
Jim Suen
11-27 4147
问题描述 打开接手的一个项目中发现背景图不显示，F12后发现路径被解析成了 css background: url(/abc\imgs\background.jpg) no-repeat center; 手动在浏览器中把反斜杠改为斜杠图片正常显示 css background: url(/abc/imgs/background.jpg) no-repeat center; 查看代码，代码中...
用uniapp的props动态传image的url时，移动端无法显示图片？
m0_51066449的博客
05-19 1291
解决方法： 1.检查image标签的src属性是否为动态绑定，若直接放在style属性里，改成如下形式： <image :src='box.url'></image> 2.用require请求动态路径 imgs: [ require('../../static/index-icon/vegetable@2x.png'), require('../../static/index-icon/vegetable@2x.png'), requi
Python中的正斜杠与反斜杠解析
如果要在字符串中直接使用反斜杠，需要使用两个反斜杠 `\\` 来表示一个实际的反斜杠。例如，路径 `"C:\Windows\temp\readme.txt"` 使用单个反斜杠会引发转义问题，因为`\t`会被解析为制表符而不是`temp`的一部分。...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值