image动态获取本地静态文件的不同图片路径 vue实现

有个需求，布局：左边一个小图标，右边对应商品描述。不同图片对应不同文字。后端不返路径的情况下，前端从静态文件夹获取图片

用if else 写，页面不好看

做法：

1.在img 绑定一个方法getpic ，方法传的参数是商品的id号。

2.静态文件夹中图片的名字为对应的商品的id

代码实现：

<img class="product_ico" :src="getpic(mydata.GoodsValue)" />  

js部分：

getpic(GoodsValue) {
      if(GoodsValue=='202001' || GoodsValue=='202002' || GoodsValue=='202003'){
        return "./static/images/icon_" + GoodsValue+ ".png";
      }
      
    }

这样就能实现，当右边商品id是202001时，对应的图标是202001（PS：静态文件夹中的名字一定要与后端返的id号一致）

这样式实现方式，在html上就避免了大量的if else 代码会比较简洁