img标签动态,添加相对路径

简介: img标签动态,添加相对路径

目前遇到的业务是封装好的组件,需要传一个相对路径的一组图片路径

一、什么是相对路径?

基于当前文件, 其他文件的路径;

写法:

  1. ./ 当前目录(或者说同级目录)
  2. ../ 父级目录
  3. / 根目录

以上三种方法都试过,没有效果,于是用的下面的写法

  <div v-for="(item,index) in img" :key="index">
    <img :src="img[index]" />
  </div>
  data(){
    return{
        img: [
          require("@/assets/images/imgver/ver-1.png"),
          require("@/assets/images/imgver/ver-2.png"),
          require("@/assets/images/imgver/ver-3.png"),
          require("@/assets/images/imgver/ver-4.png"),
          require("@/assets/images/imgver/ver-5.png"),
          require("@/assets/images/imgver/ver-6.png"),
        ],
    }
  }
相关文章
|
4月前
|
JavaScript 前端开发
JS - 正则替换富文本内容的所有图片地址,并提取src、alt、style等属性
这篇文章提供了使用JavaScript正则表达式来替换富文本中所有图片地址,并提取`src`、`alt`、`style`等属性的示例代码和方法。
292 1
|
5月前
|
XML 数据采集 机器学习/深度学习
使用 XPath 定位 HTML 中的 img 标签
使用 XPath 定位 HTML 中的 img 标签
返回目录中所有JPG图像的文件名列表
返回目录中所有JPG图像的文件名列表
|
应用服务中间件
JavaWeb项目img标签的图片无法加载的原因及解决方法
JavaWeb项目img标签的图片无法加载的原因及解决方法
1080 0
JavaWeb项目img标签的图片无法加载的原因及解决方法
|
编解码 前端开发 JavaScript
img标签中的srcset属性有什么用?
img元素的srcset属性用于浏览器根据宽、高和像素密度来加载相应的图片资源。 也就是说,我们不需要使用JavaScript也可以实现分辨率自适应。
385 0
|
前端开发
react 判断标签img 图片是否存在,不存在则替换为默认图片
react 判断标签img 图片是否存在,不存在则替换为默认图片
825 0
|
移动开发 HTML5
HTML5图片标签和路径
HTML5图片标签和路径