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