vue項目加載圖片問題（未解決）

問題描述： 最近做一個vue項目，自己想封裝一個小組件，但是組件中圖片是父級定義的，因此路徑需要父級傳過來，子級去顯示。

做項目的時候發現在vue中，使用img標籤直接加載圖片是沒有問題的

<img src="@/assets/img/demo.png">

但是當src使用變量，則會被編譯爲字符串，導致編譯後的路徑就是我們寫上去的字符串形式

data() {
  return {
    src: '@/assets/img/demo.png' 
  }
}

<img :src="src">

瀏覽器中編譯後顯示的地址爲我們data中定義的數據，顯然沒有經過編譯。

經過查閱發現這些資源需要進行請求，可以使用require進行資源請求，於是我這麼寫

let src = '@/assets/img/demo.png';
require(src)

直接報錯，查詢發現require內容不能使用變量。

===========================================

擴展參閱

https://lvyongbo.gitbooks.io/vuejs-templates/content/static.html