不知道各位小伙伴有没有在开发遇到一个问题，就是在线上的项目使用后台返回本地图片路径，然后加载不上的情况呢？

我的解决方法就是：先在项目的data下定义好这样一个数组用于存放需要加载的路径

[

　　{name:"张山" url：require（./img/zhangshan.png）} ,

　　{name:"李四" url：require（./img/zhangshan.png）} ,

　　{name:"老王" url：require（./img/zhangshan.png）}

],

通过后台传过来的字段匹配上然后就可以把本地url 替换接口的路径然后大功告成！

如何在vue中使用动态使用本地图片路径的更多相关文章

  1. 如何在vue中修改动态标签中的样式和修改组件库样式

    vue中修改动态标签中的样式和修改组件库样式 因为vue中的标签在渲染的时候,都会给标签加上id 所以你想在<style lang="scss" scoped>直接修改 ...

  2. vue中如何动态的绑定图片，vue中通过data返回图片路径

    在项目中遇到需要动态的改变图片路径,图片路径并非是从后台获取过来的数据. 因此在data中必须用require加载,否则会当成字符串来处理. 效果:

  3. vue中el-upload上传多图片且携带参数，批量而不是一张一张的解决方案

    现在前端基本不是vue技术栈就是react技术栈. vue技术栈最常用的就是element-ui的ui框架了. 在项目中,我们经常会碰到这种需求:批量上传文件 element-ui 确实也为我们提供了 ...

  4. Atitit. IE8.0 显示本地图片预览解决方案 img.src=本地图片路径无效的解决方案

    Atitit. IE8.0 显示本地图片预览解决方案 img.src=本地图片路径无效的解决方案 1. IE8.0 显示本地图片 img.src=本地图片路径无效的解决方案1 1.1. div来完成  ...

  5. 如何在vue中使用ts

    注意:此文并不是把vue改为全部替换为ts,而是可以在原来的项目中植入ts文件,目前只是实践阶段,向ts转化过程中的过渡. ts有什么用? 类型检查.直接编译到原生js.引入新的语法糖 为什么用ts? ...

  6. 如何在Vue中建立全局引用或者全局命令

    1 一般在vue中,有很多vue组件,这些组件每个都是一个文件.都可能需要引用到相同模块(或者插件).我们不想每个文件都import 一次模块. 如果是基于vue.js编写的插件我们可以用 Vue.u ...

  7. 如何在vue中使用svg

    1.安装依赖 npm install svg-sprite-loader --save-dev 2.在config文件中配置    const path = require('path'); func ...

  8. 如何在vue中引入图片？

    当我们在Vue.js项目中引用图片时,关于图片路径有以下几种情形: 使用一. 我们在data里面定义好图片路径 imgUrl:'../assets/logo.png' 然后,在template模板里面 ...

  9. 如何在Vue中优雅的使用防抖节流

    1. 什么是防抖节流 防抖:防止重复点击触发事件 首先啥是抖? 抖就是一哆嗦!原本点一下,现在点了3下!不知道老铁脑子是不是很有画面感!哈哈哈哈哈哈 典型应用就是防止用户多次重复点击请求数据. 代码实 ...

随机推荐

  1. ArrayList、LinkList、Vector的区别

    ArrayList.LinkedList和Vector均实现了List接口,均为可伸缩数组(均为可动态改变长度的数组).它们是有序的集合,并且其中的元素允许重复. 从底层实现来看: (1)ArrayL ...

  2. apache thrift分析

    thrift是一个用来实现跨语言的远程调用(RPC Remote Procedure Call)的软件框架.根据接口定义语言(IDL Interface definition lanuage) 并借助 ...

  3. Linux里的eval命令

      这个命令之前没有用过,在网上查了一下资料,觉得人家写的很好,所以复制过来了. 标题:linux命令eval的用法 链接:http://blog.chinaunix.net/uid-21411227 ...

  4. vue初始化页面dom操纵 $nextTick

    new Vue({ el: '#app', data:{ }, mounted: function () {/*生命周期函数*/ this.$nextTick(function () { $(&quo ...

  5. python自动化开发-[第十一天]-Mysql

    今日概要: 1.初识mysql 2.MySQL的增删改查 3.主键.外键 4.组合和分组 一.数据库的由来 1.什么是数据库? 数据的仓库,在ATM,购物车中存储数据为目录,称为数据库 1.数据以表格 ...

  6. python csv与字典操作

    # encoding: utf-8 import csv d1 = {'banana':3,'apple':4,'pear':1,'orange':2} d2 = {'banana':3,'orang ...

  7. java基本类型及其相互转换

    1.基本数据类型 java中是采用Unicode编码的,其一个字符占用两个字节,故java中字符char可以存储一个中文汉字 整数默认是int类型,浮点数默认是double类型 在定义long类型的变 ...

  8. python 面向对象(六)MRO C3算法 super

    ########################总结################ 面向对象回顾 类:对某一个事物的描述,对一些属性和方法的归类 class 类名: var=123#类变量 def ...

  9. JMX监控Hadoop的部分常用参数位置

    近期版本get无法使用,可能使用了其他参数代替,但源码中已经去掉JMX部分,也没有给出替代接口,应该是不再额外实现了. NameNode DataNode HDFS Yarn HBase MapRed ...

  10. [NIO-2]通道和FileChannel

    通道是什么 通道式(Channel)是java.nio的第二个主要创新.通道既不是一个扩展也不是一项增强,而是全新的.极好的Java I/O示例,提供与I/O服务的直接连接.Channel用于在字节缓 ...