解决方案
加上require
即可
<div class="wrapper-home-top-topic">
<img :src="envLanguage==1?require('@/assets/img/afterreviewCt.png'):(envLanguage==2?require('@/assets/img/afterreview.png'):require('@/assets/img/afterreviewEn.png'))" alt="" />
</div>
代码优化:
这里img
的src
是通过变量envLanguage
来动态变化的,从代码可以看出来envLanguage
的值有三种情况,上面是通过三目运算符来判断的,可读性不是很好,可以在computed
里面通过switch case
来计算出当前envLanguage
的值对应的src
// html
<div class="wrapper-home-top-topic">
<img :src="reviewBg" alt="" />
</div>
// js
computed: {
reviewBg() {
switch (envLanguage) {
case 1:
return require('@/assets/img/afterreviewCt.png');
case 2:
return require('@/assets/img/afterreview.png');
case 3:
return require('@/assets/img/afterreviewEn.png');
default:
return '';
}
}
},