img标签动态,添加相对路径_js中img标签动态赋值路径_程序员啊楠的博客-程序员秘密

技术标签: html  javascript  

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

一、什么是相对路径?

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

写法:

  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"),
        ],
    }


  }

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/weixin_56650035/article/details/118877873

智能推荐

有关第一个react页面中页面渲染的几种方法总结_react详情可以先渲染一屏_哼,小呀么小胖子的博客-程序员秘密

简述:第一个页面 ReactDom.render(&lt;div&gt;我的第一个react页面&lt;/div&gt;,document.getElementById("root"));中的&lt;div&gt;我的第一个react页面&lt;/div&gt;,document.getElementById("root")本质上是一个函数,可以有参数,返回值,可以调用,存在多种写...

【BIT大作业】人工智能+五子棋实战(二)博弈搜索算法_人工智能大作业博弈_BIT可达鸭的博客-程序员秘密

【BIT大作业】人工智能+五子棋实战(二)博弈搜索算法博弈树算法简介:代码实现:效果:博弈树算法简介:emmm可以看这个博主的博客:五子棋智能算法-博弈树算法思想详解代码实现:核心代码:# DFS: 博弈树搜索# ----------------------------------------------------------------------class searcher(object): # 初始化 def __init__(self): self.

NUMA_power服务器 numa_powersaven的博客-程序员秘密

转自: http://wiki.ccw.com.cn/NUMANUMA(Non Uniform Memory Access Achitecture)技术可以使众多服务器像单一系统那样运转,同时保留小系统便于编程和管理的优点。基于电子商务应用对内存访问提出的更高的要求,NUMA也向复杂的结构设计提出了挑战。我们知道,当今数据计算领域的主要应用程序和模型可大致分为联机事务处理(OLTP)、

org.apache.log4j.Logger 详解_weixin_33851429的博客-程序员秘密

为什么80%的码农都做不了架构师?&gt;&gt;&gt; ...

Eclipse用法和技巧十九:eclipse修改workspace_Andrew这个昵称的博客-程序员秘密

工作中某一个项目的文件一般都在某一个路径,大多数人都习惯固定eclipse的workspace。不过偶尔也有点别的,比如做一个大项目中穿插着做些OJ,或者别的……这个时候当然可以选择在安装一个eclipse,不过也可以设置eclipse的workspace来进行切换。下面来说说workspace,一般首次打开workspace,大家都习惯勾上设置为默认的workspace的选项,这样启动第二个ec

MyBatis-Spring中间件逻辑分析(怎么把Mapper接口注册到Spring中)_weixin_30755709的博客-程序员秘密

1. 文档介绍  1.1. 为什么要写这个文档接触Spring和MyBatis也挺久的了,但是一直还停留在使用的层面上,导致很多时候光知道怎么用,而不知道其具体原理,这样就很难做一些针对性的优化工作,Spring和MyBatis都已经是很庞大的框架了,分析起来会需要很多的时间,所以我先从两者之间的中间件MyBatis-Spring开始,一步一步开始学习两个框架的原理和精...

随便推点

华为AC6005-8升级记录_ac6005 命令行 初始化_高彬的博客-程序员秘密

无线控制器忽然菪机,重启失败,SYS信号灯快闪,表示系统启动中,通过超级终端(连接线见步骤四)查看console输出信息,关键是这几句有问题:MMC : sd_send_op_cond: Timed out Card did not respond to voltage select!Not Exist!SD : sd_send_op_cond: Timed outCard d...

python有道字典_Ubuntu安装有道词典_weixin_39626745的博客-程序员秘密

测试安装有道词典的环境为ubuntu 16.04 AMD64,理论上其他版本也可以按照这个流程安装。1、到有道官网下载安装包youdao-dict_1.1.0-0-ubuntu_amd64.deb。2、双击打开安装,会出现下面出错:需要安装的依赖包: ['python3-pyqt5', 'python3-xlib', 'tesseract-ocr', 'tesseract-ocr-eng', 't...

经典面试题--不调用库函数实现字符串的拷贝_robertkun的博客-程序员秘密

#include using namespace std;char* strcpy_(char* strDes, const char* strSrc){ if(strSrc == NULL || strDes == NULL) throw "invaild argument(s)"; char* temp = strDes; while((*strDes++ = *strSrc++) != '/0'){}

在eclipse导入一个Web项目后,出现“http://java.sun.com/jsp/jstl/core”错误_KarrieChan的博客-程序员秘密

根据错误信息提示,原因是缺少了需要用到的jar包,所有只要导入相应的jar包就可以了。方法:把jstl.jar和standard.jar这两个包放到Web服务目录下的WEB-INF/lib,然后再进行build Path导入到库里面。这里提供这两个包的下载:点击打开链接...

第五节,损失函数:MSE和交叉熵_weixin_30376163的博客-程序员秘密

损失函数用于描述模型预测值与真实值的差距大小,一般有两种比较常见的算法——均值平方差(MSE)和交叉熵。1、均值平方差(MSE):指参数估计值与参数真实值之差平方的期望值。在神经网络计算时,预测值要与真实值控制在同样的数据分布内,假设将预测值经过Sigmoid激活函数得到取值范围在0~1之间,那么真实值也归一化到0~1之间。2、交叉熵:预测输入样本属于某一类的概率。...

Android游戏引擎--AndEngine入门_weixin_30455023的博客-程序员秘密

AndEngine是一款以OpenGLES方式进行画面渲染的2D游戏引擎,可以运行在支持Android1.6及以上版本的系统当中。应该说,相较前文介绍的Libgdx引擎,AndEngine拥有更多的游戏组件与扩展功能。并且与Libgdx不同,它在默认情况下已经可以支持中文,采用屏幕坐标系绘也更符合一般Android绘图习惯。然而,有其利也必有其弊,AndEngine作为游戏引擎虽然...

推荐文章

热门文章

相关标签