原因:因?yàn)閯討B(tài)添加src被當(dāng)做靜態(tài)資源處理了,沒有進(jìn)行編譯,所以要加上require惋嚎。
使用require定義之后,你就可以動態(tài)使用了站刑,不用require你就只能寫死的瘸彤。
用 :src="'../img/image.jpg'" 找不到圖片地址
<img src="../img/image.jpg"> // 正常加載
如何使用require:
src1:require('../img/image1.jpg'),
src2:require('../img/image2.jpg'),
index: 1,
<img :src="index = 0 ? src1: src2"> // 動態(tài)地址,正常加載
或者 <img :src="require('../../../assets/'+item.name+'_icon.png')">
vue3如何動態(tài)綁定圖片:
function getImageUrl(name){
return new URL(../../assets/images/${name}.png
,import.meta.url).href
}