vue中使用 require() 來引入靜態圖片資源
在vue項目中,通過變量引入靜態圖片資源或者因為某些需求需要通過js來動態改變圖片時,圖片顯示不出來。
通過在瀏覽器中查看元素,發現圖片的地址是相對地址,但顯示不出來。


后來發現,原來是vue在DOM中直接引入的圖片會被轉為 base64 格式的,但是使用變量引入的話,圖片不會轉為 base64 格式的,所以不會 正常顯示。
解決方法就是變量使用
require 來引入圖片


這樣能正常顯示了。在js中使用變量來動態改變圖片時,也使用
require 來改變變量的值。
有其他解決方案或者有什么不對的地方歡迎留言。