Vue动态引入本地图片

前言：本次在项目中需要生成一个列表，并根据返回不同的文档类型动态的展示图片，在后台数据没有返回给图片的情况下发现，仅仅使用v-if或v-show判断使用哪一张本地图片，在循环出来的列表中是无法实现效果的，所以用到了动态引入图片

1.准备两张图片拷贝到assets目录中

2.在Vue文件中引入

import a from '../../../assets/image/a.png'
import b from '../../../assets/image/b.png'

3.在接口方法中使用

    list () {
      let params = {

      }
      this.$api.getList(params)
        .then(res => {
          data.forEach(item => {
            //如果是doc文件，使用a图片
            if (this.append === '.doc') {              
              arr.imgUrl = a
            }
            //如果是Excel文件，使用b图片
            if (this.append === '.excel') {
              arr.imgUrl = b
            }
            this.showList.push(arr)
          })
        })
    },