最近开发了一个项目,头一回使用electron,很多写代码的习惯都还是原来的。
有个功能是切换菜单,UI是要按钮变色,本来想用icon应付一下,但是又不想去收集icon,就用了他UI的图片。没想到啊!给我炸出一个坑来了
// ts数据是这样的
{
title: "首页",
activeIcon: Icon_0_0, // 这是后来的想法,这个方式需要在vite-env.d.ts文件配置一下导入
defaultIcon: Icon_0_1
},
{
title: "个人中心",
activeIcon: "/src/assets/img/tabbar/1-1.png", // 这是本来的想法,进行动态图片
defaultIcon: "/src/assets/img/tabbar/1-0.png"
}
// html 是这样写的
<img :src="item.activeIcon.toString()">
效果在浏览器上是正常的,但是桌面应用就需要使用file://协议,这个方式动态图片是有问题的(本质上是协议路径错误)
所以还是老老实实引入后再进行动态图片吧