拼接图片路径不显示:vue

下面这2中方法都不能显示图片 

<img :src="'@/assets/'+ scope.row.iconName+'.svg'" width="15"/>
<img :src="`@/assets/icons/${scope.row.iconName}.svg`" width="15"/>

而这样可以

<img src="@/assets/icons/sign.svg" width="15"/>

有可能是因为模板字符串中使用的路径格式不正确,或者是在模板字符串中拼接路径时出现了问题。在 Vue 模板中,使用模板字符串插入变量通常都是有效的,但有时可能会出现一些问题。

可以尝试一下这种写法:

<img :src="require(`@/assets/icons/${scope.row.iconName}.svg`)" width="15"/>

这种写法使用了 require 函数来动态加载图片资源,通常可以解决一些路径相关的问题。

相关推荐

  1. 拼接图片路径显示vue

    2024-05-13 03:04:02       11 阅读
  2. Vue】Pdf转图片功能+多张图片拼接封装

    2024-05-13 03:04:02       9 阅读

最近更新

  1. TCP协议是安全的吗?

    2024-05-13 03:04:02       16 阅读
  2. 阿里云服务器执行yum,一直下载docker-ce-stable失败

    2024-05-13 03:04:02       16 阅读
  3. 【Python教程】压缩PDF文件大小

    2024-05-13 03:04:02       15 阅读
  4. 通过文章id递归查询所有评论(xml)

    2024-05-13 03:04:02       18 阅读

热门阅读

  1. 力扣 516. 最长回文子序列 python AC

    2024-05-13 03:04:02       15 阅读
  2. 【linux软件基础知识】-cdev_alloc

    2024-05-13 03:04:02       11 阅读
  3. halcon学习之形状匹配

    2024-05-13 03:04:02       6 阅读
  4. logback 日志脱敏

    2024-05-13 03:04:02       7 阅读
  5. Google Gemma 2B 微调实战(IT科技新闻标题生成)

    2024-05-13 03:04:02       12 阅读
  6. 生成ssh来连接git

    2024-05-13 03:04:02       11 阅读
  7. 旋转木马案例

    2024-05-13 03:04:02       8 阅读
  8. HTTP 结构概述

    2024-05-13 03:04:02       11 阅读
  9. Android app通过jcifs-ng实现Samba连接共享文件夹

    2024-05-13 03:04:02       10 阅读
  10. MySQL教程-输入查询

    2024-05-13 03:04:02       10 阅读
  11. 【教程】英文字幕批量翻译

    2024-05-13 03:04:02       13 阅读