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/`: 图片的相对地址
相关推荐
程序员老赵15 小时前
Docker 部署 ZLMediaKit:轻松搭建高性能流媒体服务平台
前端·javascript·后端
风月说与山鬼15 小时前
四、浏览器存储
前端·vue.js
拾年27515 小时前
前后端分离开发,别再"傻等"后端接口了——聊聊前端接口工程
前端·javascript·react.js
SendTomo15 小时前
SendTomo稳定传输三大核心策略
javascript·网络协议·webrtc·html5·p2p
阿懂在掘金15 小时前
记录四年前的一次前端项目权限方案改造
前端·vue.js·架构
禁止摆烂_才浅15 小时前
Vue2 高频面试题
前端·vue.js·面试
禁止摆烂_才浅15 小时前
Vue3 高频面试题
前端·vue.js·面试
天才熊猫君15 小时前
从“改自己”到“改布局”——拖拽调整的通用设计思路
前端·javascript
weixin_BYSJ198716 小时前
springboot小区物业管理小程序---附源码45555
java·javascript·spring boot·python·django·flask·php
默_笙16 小时前
🍳 受控组件和非受控组件,我纠结了一整天,最后用"房东和租客"讲明白了
前端·javascript