vue+ele 表格 根据表格字段名称显示前端图片文件夹对应图片 没有图片显示单独图片

ele表格中根据 对应字段 使用前端项目中的文件夹匹配相应的图片展示

{{scope.row.categoryName}} 展示字段

<el-image :src="`/AppliancePictures/${scope.row.categoryName}.jpg`"

${scope.row.categoryName}.jpg`

${scope.row.categoryName}根据字段匹配是否有相对应图片

img slot="error" :src="`/AppliancePictures/暂无图片.jpg`

没有对应图片 error 引入没有相匹配的图片文件

实现效果