当前位置: 首页 > news >正文

img标签src动态绑定资源失败问题

img标签src动态绑定资源失败问题

需要采用require的方式进行

在 Vue 中,require 是一个通用的模块加载函数,用于在运行时(客户端或服务器端)引入模块。它通常用于加载 JavaScript 文件、JSON 数据、静态资源等。

组件使用: 

 <MyBox :mapIcon="require('./../../assets/images/'imgSrc+'.png')"></MyBox >

组件代码:

  <img class="primary" :src="mapIcon" :alt="mapTitle" />

此时就可以实现正常的访问指定路径下的静态资源了。

原先的时候直接

  <img class="primary" src="../assert/images/xx.png" :alt="mapTitle" />

采用路径的形式就可以直接访问到对应的图片,但是现在采用动态绑定的时候路径的图片直接就是一个地址,不是一个base64的资源信息,需要采用上面的require进行资源的导入。

http://www.lryc.cn/news/185559.html

相关文章:

  • 【自学笔记】网络安全——黑客技术
  • Rust 技术文档及详细使用命令
  • 建立HTTP代理IP池的技术和工具支持
  • 【机器学习】数据格式csv/txt/pkl
  • unity脚本_Input鼠标键盘 c#
  • 解析‘找不到msvcp140.dll无法继续执行代码’这个问题的解决方法
  • 练[FBCTF2019]RCEService
  • php实战案例记录(21)sprintf函数
  • 【数据结构-二叉树 九】【树的子结构】:树的子结构
  • 七张图解锁Mybatis整体脉络,让你轻松拿捏面试官
  • 力扣之删除有序数组中的重复项
  • pnpm、npm、yarn 包管理工具『优劣对比』及『环境迁移』
  • 【AntDesign】多环境配置和启动
  • Unix Network Programming Episode 78
  • 学习笔记(css穿透、vue-cookie、拦截器、vuex、导航守卫、token/Cookie、正则校验)
  • Day4:Linux系统编程1-60P
  • 【HuggingFace】Transformers(V4.34.0 稳定)支持的模型
  • oracle 导入数据泵常用语句
  • tensorflow中的常见方法
  • 【周末闲谈】“PHP是最好的语言”这个梗是怎么来的?
  • 四位十进制数字频率计VHDL,仿真视频、代码
  • Unity实现设计模式——策略模式
  • C++基础——数据类型
  • 文本自动输入/删除的加载动画效果
  • PHP8的匿名类-PHP8知识详解
  • WebKit Inside: CSS 样式表的匹配时机
  • <HarmonyOS第一课>从简单的页面开始——闯关习题及答案
  • 视频下载plus+:一款强大的视频下载小程序
  • 扭线机控制
  • Android App启动优化之启动框架