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"),
        ],
    }
  }
相关文章
|
5月前
|
JavaScript 前端开发
JS - 正则替换富文本内容的所有图片地址,并提取src、alt、style等属性
这篇文章提供了使用JavaScript正则表达式来替换富文本中所有图片地址,并提取`src`、`alt`、`style`等属性的示例代码和方法。
376 1
|
7月前
|
JavaScript 前端开发
详尽分享解决img的src属性为空时会有边框的情况
详尽分享解决img的src属性为空时会有边框的情况
268 0
返回目录中所有JPG图像的文件名列表
返回目录中所有JPG图像的文件名列表
|
JSON JavaScript 数据格式
解决vue图片标签动态绑定本地图片路径不显示问题
解决vue图片标签动态绑定本地图片路径不显示问题
318 0
05 - 超链接 a 标签+ 图片标签img
05 - 超链接 a 标签+ 图片标签img
167 0
|
编解码 前端开发 JavaScript
img标签中的srcset属性有什么用?
img元素的srcset属性用于浏览器根据宽、高和像素密度来加载相应的图片资源。 也就是说,我们不需要使用JavaScript也可以实现分辨率自适应。
398 0
|
前端开发
react 判断标签img 图片是否存在,不存在则替换为默认图片
react 判断标签img 图片是否存在,不存在则替换为默认图片
840 0
|
JavaScript
(富文本常用)js遇到需要正则匹配来修改img标签+清除行内样式
(富文本常用)js遇到需要正则匹配来修改img标签+清除行内样式
484 0
|
移动开发 HTML5
HTML5图片标签和路径
HTML5图片标签和路径
|
BI 容器
HTML——标签,路径,锚点,列表
HTML——标签,路径,锚点,列表
169 0

热门文章

最新文章