vue3.2中img动态src引入不生效问题

                        <div v-for="ele in counteresignItem.fileInfoList">
                        
                       <img :src=ele.fileUrl" />
           
                        </div>

这样正常使用并不能正常引入图片，vue3.2作为按需引入的版本。

解决方式

可以单独写一个文件，将图片引入后再将其抛出，

新建getImgFilr.js文件

import cadIcon from '@/assets/images/wxscanner/cadIcon.png'
import docIcon from '@/assets/images/wxscanner/docIcon.png'
import jpgIcon from '@/assets/images/wxscanner/jpgIcon.png'
import bmpIcon from '@/assets/images/wxscanner/bmpIcon.png'

const list = [
  {
    type: 'jpg',
    img: jpgIcon
  },
  {
    type: 'cad',
    img: cadIcon
  },
  {
    type: 'doc',
    img: docIcon
  },
  {
    type: 'bmp',
    img: bmpIcon
  },
]

const getUrl = (type)=>{
  const file = list.find(ele=>ele.type===type)
  if (file){
    return file.img
  }else{
    return unknownIcon
  }
}

export default getUrl

在需要的地方调用

                        <div v-for="ele in counteresignItem.fileInfoList">
                       <img class="fileIconImgCss" :src="getUrl(ele.ext)" />
                        </div>