vue 相对路径的图片 不显示问题
例如
data () {
return {
img: '../../images/jifen/index/img_list_default_pic.jpg' //路径也没问题啊,怎么不显示呢,难道他瞎啦!
}
}
然后在template中
<img :src="img" />
第一种解决方案是:简单粗暴型 使用绝对路径也就是带上域名即可
第二种解决方案是:非常智慧型 代码如下:
data () {
return {
img: require('../../images/jifen/index/img_list_default_pic.jpg') //加上require即可
}
}
另一种方式可以当做背景
<div :style="{backgroundImage: 'url(' + img + ')'}"></div>
或者直接在css中定义
background-image: url('../../images/jifen/index/img_list_default_pic.jpg');
vue 相对路径的图片 不显示问题的更多相关文章
- 根据url路径获取图片并显示到ListView中
项目开发中我们需要从网络获取图片显示到控件中,很多开源框架如Picasso可以实现图片下载和缓存功能.这里介绍的是一种简易的网络图片获取方式并把它显示到ListView中. 本案例实现的效果如下: 项 ...
- 🍓 vue循环渲染本地图片不显示? 🍓
teamList: [{ title: '大数据拍牌', imgUrl: './img/data.jpg', introduce: '5星服务:强烈推荐', cost: '15000', bail: ...
- MVC中根据后台绝对路径读取图片并显示在IMG中
数据库存取图片并在MVC3中显示在View中 根据路径读取图片: byte[] img = System.IO.File.ReadAllBytes(@"d:\xxxx.jpg"); ...
- Vue src动态引入图片不显示问题
使用vue动态引入图片显示失败,查看控制台,发现图片返回类型为text/html,这里我的图片是从后台服务器上获取的,如果你没有使用Vue的devServer.proxy 进行代理,可以光速移步百度 ...
- 周记4——vue中动态添加图片无效、build上线后background-image路径问题
又是一个周五,又一周要过去了...很开心,这周遇到了vue中的一个比较常见的坑,网上随便一搜就有了很多解决方案...“幸运”的是,我选了一个带坑的方案...所以我觉得有必要记录一下这个“坑中坑”... ...
- vue打包后js和css、图片不显示,引用的字体找不到问题
vue打包后js和css.图片不显示,引用的字体找不到问题:图片一般都是背景图片. 一.vue打包出现js和css不显示问题: 1.不使用mode:'history' 2.使用mode:'histor ...
- 织梦dedecms5.7二级域名文章图片不显示修改方法.相对路径改为绝对路径的方法
dedecms升级到5.7SP1后,开启二级域名,你会发现,在二级域名下的文章,上传的图片地址都是:二级域名+图片地址,这是相对路径.但是你的图片是默认上传在uploads里面的.应该使用绝对路径.这 ...
- vue打包后CSS中引用的背景图片不显示问题
vue项目中,在css样式中引用了一张背景图片,开发环境下是可以正常显示,build之后背景图片不显示. 解决方法: 找到build/utils.js文件 修改成为如下所示内容: 添加红框中的内容即 ...
- dedecms5.7二级域名文章图片不显示修改方法.相对路径改为绝对路径的方法
dedecms5.7(织梦CMS5.7)二级域名文章图片不显示修改方法.相对路径改为绝对路径的方法 dedecms升级到5.7SP1后,开启二级域名,你会发现,在二级域名下的文章,上传的图片地址都是: ...
随机推荐
- Java代码审计连载之—SQL注入
前言近日闲来无事,快两年都没怎么写代码了,打算写几行代码,做代码审计一年了,每天看代码都好几万行,突然发现自己都不会写代码了,真是很DT.想当初入门代码审计的时候真是非常难,网上几乎找不到什么java ...
- Linux链接脚本学习--lds(转)
Linux链接脚本学习--lds 一.概论 ld: GNU的链接器. 用来把一定量的目标文件跟档案文件链接在一起,并重新定位它们的数据,链接符号引用. 一般编译一个程序时,最后一步就是运行ld进行链接 ...
- Python语法基础练习
- JS: 数组的循环函数
JS 数组相关的循环函数,用得挺多,所以有些坑还是要去踩一下,先来看一道面试题. 注意:下面提到的不改变原数组仅针对基本数据类型. 面试题 模拟实现数组的 map 函数. 心中有答案了吗?我的答案放在 ...
- 找到IIS 站点对应的站点日志
IIS6 下 IIS7 下 1 找到日志文件的路径 2 找到站点ID 3 打开日志文件路径,找到站点ID 对应的日志文件夹.文件夹的最后一位数字,就对应着站点ID.
- odoo开发 相关知识点
(1)导入模块可以起别名: (2) 新的模型前端要调用显示有关联的另一个模型的相关字段 (3) 传递上下文 搜索视图打开默认按照接收的参数搜索显示: 发起端视图 上下文写法: 目标端 触发显示,搜索视 ...
- 前端基础——css
前端基础——css css的内容主要包括:盒子模型.定位.单位与取值.属性.选择器.
- Android 开发工具类 33_开机自运行
原理:该类派生自 BroadcastReceiver,重载方法 onReceive ,检测接收到的 Intent 是否符合 BOOT_COMPLETED,如果符合,则启动用户Activity. imp ...
- 如何恢复windows的exe文件的默认打开方式
事情由来: 有一次在用一个播放器选择打开视频文件的时候,意外的手贱点击打来了 exe 文件,之后戏剧性的恶心开始了,首先当然是打开失败,接着整个桌面的 exe 文件全部被替换成那个播放器的图标,然后所 ...
- 软件架构设计学习总结(4):大数据架构hadoop
摘要:Admaster数据挖掘总监 随着互联网.移动互联网和物联网的发展,谁也无法否认,我们已经切实地迎来了一个海量数据的时代,数据调查公司IDC预计2011年的数据总量将达到1.8万亿GB,对这些海 ...