vue3项目img标签动态设置src,提示:ReferenceError: require is not defined

1、 问题:

vue3项目中, 动态设置img标签的src属性

js 复制代码
<img class="svg" :src="require(`@/assets/imgs/${imgUrl}`)" />

报错:ReferenceError: require is not defined

2、 解决

js 复制代码
<img class="svg" :src='getImgUrl()' />

//js
  let imgUrl = ref('****.png') //动态图片名称
  const getImgUrl = () => {
    const str = imgUrl.value;
    return new URL(`./../imgs/` + str, import.meta.url).href
  }
  //`./../imgs/`: 图片的相对地址
相关推荐
小磊哥er28 分钟前
深入解构Claude Code - 第 8 篇 · 数据放哪、钱怎么算
javascript·ai编程
kyriewen2 小时前
我装了30多个Skill,给AI安排了8个岗位
前端·javascript·ai编程
默_笙4 小时前
🔥 让 AI 帮我写完整个 Next.js 博客:框架就是 AI 的"上下文 buff"
前端·javascript
OpenTiny社区6 小时前
从流式消息到多会话:TinyRobot Kit 如何组织 AI 对话数据层
vue.js
喵本喵叁肆7 小时前
06-M6-部门过滤与综合研判-从问答机到研判助手
前端·javascript·jquery
卤蛋fg67 小时前
vue表格组件 vxe-table 鼠标滑动表头选择整列与选择整行的配置详解
vue.js
এ慕ོ冬℘゜8 小时前
JavaScript学习心得:从只会语法,到真正会写业务逻辑
开发语言·javascript·ecmascript
এ慕ོ冬℘゜8 小时前
jQuery 核心方法
前端·javascript·jquery
阳火锅8 小时前
老板要周报?我说不用,代码提交就是进度
前端·javascript·vue.js