Vue项目中动态绑定src路径不成功(已解决)
问题:在做Vue项目的时候,由于项目需求,需要动态绑定img的src时,突然发现如果说是直接请求后台接口的图片地址就能显示,但是直接动态绑定img的src的图片的相对路径或者是绝对路径的时候,图片不能显示,控制台也不报错html代码:<img :src="MyimgSrc" alt=""&
·
问题:
在做Vue项目的时候,由于项目需求,需要动态绑定img的src时,突然发现如果说是直接请求后台接口的图片地址就能显示,但是直接动态绑定img的src的图片的相对路径或者是绝对路径的时候,图片不能显示,控制台也不报错
html代码:
<img :src="MyimgSrc" alt="">
js代码:
this.MyimgSrc = '../../assets/jd/market/img/temp/icon_yj.png'
但是浏览器不报错,而且f12查看元素的时候
说明已经渲染到了html的img的src上了,但是不显示在页面上
解决方法:
当在给数据MyimgSrc 设置绝对路径或者是相对路径时应该使用require引入才能成功
this. MyimgSrc = require('../../assets/jd/market/img/temp/icon_yj.png')
这样就能显示了:
总结:
当动态绑定img的src的时候,vue数据绑定图片的相对路径或者是绝对路径的时候,需要require路径
更多推荐
已为社区贡献7条内容
所有评论(0)