vue中如何動態引入圖片

以下是直接讀取某一文件夾下的圖片，感覺挺好用，記錄以下。

methods: {
    // 動態引入圖標
    loadMenuImgs() {
      let routeImgs = require.context("@/assets/icon/menu", false, /\.png$/);
      console.error(routeImgs);
      routeImgs.keys().forEach(item => {
        console.error("item", item);
        import("@/assets/icon/menu" + item.replace(".", "")).then(base64 => {
          let reg = /\.\/(.+)\.png/;
          let filename = reg.exec(item)[1];
          this.$set(this.routeImgs, filename, base64);
        });
      });
    },
}

 

使用：

<img :src="routeImgs[list.itemName]">

 

 

 

 

 

 

。