动态的src路径怎么写
错误写法
<div class="icon--wrapper" @click="before">
<img class="icon-search" :src="leftArrow">
</div>
leftArrow (index) {
if (index <= 0) {
return './imgs/left_bule@3x.png'
} else {
return './imgs/left_bule@3x.png'
}
},
正确写法
用相对路径是不行的要用绝对路径
````
<div class="icon--wrapper" @click="before">
<img class="icon-search" :src="Number(index) < 0 || Number(index) === 0 ? leftGreyPic : leftBluePic">
</div>
````
````
import leftGreyPic from '@pages/company/customer/imgs/left_grey@3x.png'
import leftBluePic from '@pages/company/customer/imgs/left_blue@3x.png'
````
在data里面定义
````
leftGreyPic: leftGreyPic,
leftBluePic: leftBluePic,
````
上面是因为打包后目录全部都变了,根目录不变,vue文件全部变成JavaScript了,保留不了原本的文件目录,你项目运行的时候 你写的相对路径找不到文件了,打包编译的时候没编译动态路径
动态的src路径怎么写的更多相关文章
- winform展示Unity3D文件(支持动态改变文件路径)
winform下展示Unity3D文件可以支持对Unity3D实现的模块进行包装,以及在其他的项目中需要展示Unity3D的界面时候,恰到适宜地进行打开展示,这里我展示如何使用winform打开Uni ...
- Linux下动态库查找路径的问题
说到和动态库查找路径相关的问题,总体上可以分为两类: 第一类: 通过源代码编译程序时出现的找不到某个依赖包的问题,而如果此时你恰好已经按照它的要求确确实实.千真万确.天地良心地把依赖库给装好了, ...
- 谈谈Linux下动态库查找路径的问题 ldconfig LD_LIBRARY_PATH PKG_CONFIG_PATH
谈谈Linux下动态库查找路径的问题 ldconfig LD_LIBRARY_PATH PKG_CONFIG_PATH 转载自:http://blog.chinaunix.net/xmlrpc.ph ...
- 谈谈Linux下动态库查找路径的问题
学习到了一个阶段之后,就需要不断的总结.沉淀.清零,然后才能继续"上路".回想起自己当年刚接触Linux时,不管是用源码包编译程序,还是程序运行时出现的和动态库的各种恩恩怨怨,心里 ...
- Linux 静态库与动态库搜索路径设置详解【转】
原文地址:http://blog.chinaunix.net/uid-29025972-id-3855495.html 1. 连接和运行时库文件搜索路径的设置 库文件在连接(静态库和共享库)和运行(仅 ...
- Linux 静态库与动态库搜索路径设置详解
转载:http://blog.chinaunix.net/uid-29025972-id-3855495.html 1. 连接和运行时库文件搜索路径的设置 库文件在连接(静态库和共享库)和运行(仅限于 ...
- [转]谈谈Linux下动态库查找路径的问题
http://blog.chinaunix.net/uid-23069658-id-4028681.html 学习到了一个阶段之后,就需要不断的总结.沉淀.清零,然后才能继续“上路”.回想起自己当年刚 ...
- 关于React的require添加动态变化的路径
关于React的require添加动态变化的路径 直接这样写显然是不会有错误的 let path = require('../images/girl.png'); 但是如果你尝试着 var gg = ...
- 转:谈谈Linux下动态库查找路径的问题
http://blog.chinaunix.net/uid-23069658-id-4028681.html 学习到了一个阶段之后,就需要不断的总结.沉淀.清零,然后才能继续“上路”.回想起自己当年刚 ...
随机推荐
- 13、VUE单文件工程
1.为什么要使用单文件工程? 1.Vue.js路由组件的不方便 不支持引用HTML页面,以至于template里面定义的标签会编辑器当字符串,这让编辑变的困难. 2.Vue.js于Node.js语言结 ...
- layui 日期插件一闪而过
关于一个layui插件日期的问题,在本地调试都是可以的,但发布到服务器上的时候,日期插件一闪而过,后来我以为是各个插件之间的冲突,我就每个插件的排除,但是还是无动于衷,然后我就去官网看了下是,需要加一 ...
- Winform c# 多线程处理实例
我们在用C# 开发程序时,经常会使用的多线程,实现多任务的处理.一般常用的方法是新建多个线程,进行处理. 今天我分享一个采用线程池的方式来实现的实例.对有需要的朋友做个借鉴. 实例: Winform ...
- Python笔记:装饰器
装饰器 1.特点:装饰器的作用就是为已存在的对象添加额外的功能,特点在于不用改变原先的代码即可扩展功能: 2.使用:装饰器其实也是一个函数,加上@符号后放在另一个函数“头上”就实现了装饰 ...
- 十八、Python面向对象之魔术方法
1.类的比较 class A(object): def __init__(self,value): self.value = value def __eq__(self,other): return ...
- 团队第五次——Alpha2的发布
这个作业属于哪个课程 https://edu.cnblogs.com/campus/xnsy/2019autumnsystemanalysisanddesign/ 这个作业要求在哪里 https:// ...
- HLOJ1361 Walking on the Grid II 矩阵快速幂
题目分析: 就当是一次记录吧,2013年绍兴市市赛的一题,重现赛当时我想递推可能是矩阵快速幂吧,但是这个递推公式真没推出来(赛后猛如虎系列),这题和第一题有联系又有区别,第一题的递推很简单,dp[i] ...
- recon-ng打开后显示No modules enabled/installed
今天开始学习使用 recon-ng,进去后发现这么一行: 原因 在网上找了挺久,发现了这篇文章:Recon-ng v5 Tutorial, 原来是更新的原因,需要我们自行安装模块(旧版本是自带了许多模 ...
- 小样本学习(few-shot learning)在文本分类中的应用
1,概述 目前有效的文本分类方法都是建立在具有大量的标签数据下的有监督学习,例如常见的textcnn,textrnn等,但是在很多场景下的文本分类是无法提供这么多训练数据的,比如对话场景下的意图识别, ...
- rhel6安装rabbitmq-sever
1.下载rabbitmq-sever3.7.7,我下的是RHEL/CentOS 6.x, 你的系统是哪个版本就下哪个https://github.com/rabbitmq/ Downloadson G ...