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/`: 图片的相对地址
相关推荐
冰暮流星12 小时前
javascript之webstorage用法
开发语言·javascript·ecmascript
执子念的飞鱼12 小时前
浏览器直接预览 Pages、Numbers、Keynote:iWork 格式真正难在哪
前端·javascript
用户3452081538812 小时前
我给 DSH 写了读 10x 数据的插件
javascript
执子念的飞鱼12 小时前
70MB Excel 浏览器预览失败:定位 XLSX 重复解压与内存峰值
javascript·性能优化
京东云开发者12 小时前
【全栈实践】第一个 AI Agent 项目:从零搭建 AI 音频创作助手【最终版】
前端·vue.js·音视频开发
12.=0.12 小时前
【REVIEW_C】【持续更新】
服务器·前端·javascript
Brown.alexis13 小时前
es6知识点4-自备使用
前端·javascript·es6
一颗烂土豆13 小时前
ECharts 太平面?试试这款 Vue 3D 图表库
前端·vue.js·echarts
Hilaku13 小时前
为什么同一段代码在 Safari 上永远有 Bug?
前端·javascript·程序员
张元清13 小时前
React scrollIntoView + useRef:滚动到指定元素 (2026)
javascript·react.js