vue 加载图片不显示

战斗中的老段2023-09-02 15:06

解决vue加载图片不显示问题

加载图片前边加上require
require通常用于引入静态资源，如图片、样式文件等。

复制代码

 navList: [
        { title: "大盘行情", imgSrc: require ("../../public../../public/imgs/nav1.png") , linkto: "" },
        { title: "股票组合", imgSrc: "../../public/imgs/nav2.png", linkto: "" },
        { title: "股票开户", imgSrc: "../../public/imgs/nav3.png", linkto: "" },
        { title: "选股攻略", imgSrc: "../../public/imgs/nav4.png", linkto: "" },
        { title: "指数选基", imgSrc: "../../public/imgs/nav5.png", linkto: "" },
        { title: "基金组合", imgSrc: "../../public/imgs/nav6.png", linkto: "" },
        { title: "私募基金", imgSrc: "../../public/imgs/nav7.png", linkto: "" },
        { title: "基金必看", imgSrc: "../../public/imgs/nav8.png", linkto: "" },
      ],

如果用v-for循环发现少图片怎么办？

解决方法：图片不再那就给它一个默认的图片加载进去

复制代码

 :icon="item.imgSrc || `/imgs/nav${i + 1}.png`"