1. 程式人生 > >vue關於img src動態賦值問題

vue關於img src動態賦值問題

問題: 我剛開始程式碼是這樣的 結果圖片載入不出來

 <img :src="'../assets/images/'+imgsrc+'.png'"/>

   props:{
        /**
         * 提示內容
         */
        msg:{
          type:String,
          default:'業務暫未開放,敬請期待......'
        },
        /**
         * 是否顯示
         */
        show:{
          type:Boolean,
          default:true
        },
        /**
         * 圖片路徑
         */
        imgsrc:{
          type:String,
          default:'notyetopened'
        },
      }

我去官網看了看是這樣寫的  我也用f12查看了src的地址沒錯....

後面接著一篇文章

https://blog.csdn.net/milan_kunderla/article/details/80319548   (感謝)

 

其中文字內容能夠正常顯示,說明傳遞的資料沒有錯

但是由於在div中顯示之前,webpack並沒有去編譯我的imgsrc

解決方法:  

加個require()就可以了

  <img :src="require('../assets/images/'+imgsrc+'.png')"/>

 效果也出來了