vue中使用:src="img"绑定本地静态资源失效问题
直接使用src本地引入图片正常显示
<img src="../assets/img/bs.png" alt="" />而使用v-bind时却意外的失效
<img :src="img" alt="" /> //js data() { return { img:require("../assets/img.png") }; },
看下浏览器生成代码
//src <img src="http://localhost:8071/img.png" alt> //:src <img src="../assets/img.png" alt>
解决方法
为了使Webpack可以正确返回资源路径, 你需要使用
:src 下放 base64格式 或者 放 require(本地图片路径）；
data() { return { img:require("../assets/img/bs.png") }; },
转：https://blog.csdn.net/dss0225/article/details/107410348