La solución que vue representa dinámicamente la imagen de la ruta local no se muestra, v-fro representa que la ruta de la imagen local no se muestra (registre el hoyo en el proyecto).

1. Si usa directamente la representación de la ruta local, no se puede representar porque, en este caso, se enviará una solicitud de red para agregar su dirección local al procesar, por lo que no se podrá representar .

 ¿Cómo puedo encontrar el camino como este? La solución es la siguiente

// 渲染正常渲染即可
<div v-for="(item, index) in imgPath" :key="index">
      <img :src="item" alt="">     
</div>

data() {
    return {
      //   使用require()包裹路径，网络路径就不需要这样直接渲染即可
      imgPath: [
        require("../assets/images/img1.jpg"),
        require("../assets/images/img2.jpg"),
      ],
    };
  },

 En este punto, la siguiente ruta no es la ruta de la imagen local.

2. La segunda solución

<div class="box">
    <div v-for="(item, index) in imgPath" :key="index">
      <img :src="require('../assets/images/' + item)" alt="" />
      <!-- 核心要点:required 引入路径需要拼接 不能直接required(imgpath) -->    
 </div>

 data() {
    return {
      imgPath: ["img1.jpg", "img2.jpg"],
    };
  },

- Eche un vistazo a mi archivo de almacenamiento de imágenes

3. La tercera solución resuelve png

  :src="getImgUrl(companyLogoList[index], 'jpg')" // 可以解决png

 data() {
    return {
      companyLogoList: [
        "img1.jpg",
        "img2.jpg",
      ],
    };
  },

 methods: {
    getImgUrl(url, type) {
      if (type == "png") {
        const a = require("../assets/images/" + url + ".png");
        return a;
      } else if (type == "jpg") {
        const b = require("../assets/images/" + url);
        console.log("b", b);
        return b;
      }
    },
  },