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

我的解决方法就是:先在项目的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. css换行

    1. word-break:break-all;只对英文起作用,以字母作为换行依据 2. word-wrap:break-word; 只对英文起作用,以单词作为换行依据 3. white-space: ...

  2. 反汇编Dis解析

    目录 反汇编dis解析 COMM段BSS段 注释段 Bl指令 title: 反汇编Dis解析 tags: ARM date: 2018-10-21 18:02:58 --- 反汇编dis解析 关于段, ...

  3. Shell中变量扩展操作

    假设我们定义了一个变量为:file=/dir1/dir2/dir3/my.file.txt 可以用${ }分别替换得到不同的值:${file#*/}:删掉第一个 / 及其左边的字符串:dir1/dir ...

  4. 5、MyBatis-parameterType 入参封装 Map 流程

    以如下入参为例,MyBatis 版本为 3.5.0 public MyUser selectMyUserIdAndAge(Integer id, @Param("user") My ...

  5. Hadoop记录-hadoop集群常见问题汇总

    [问题1]HBase Shell:ERROR: org.apache.hadoop.hbase.IPc.ServerNotRunningYetException: Server is not runn ...

  6. 使用 python -m SimpleHTTPServer 快速搭建http服务

    摘要: 在 Linux 服务器上或安装了 Python 的机器上,可以使用 nohup python -m SimpleHTTPServer [port] & 快速搭建一个http服务. 在 ...

  7. Part-Seven

    1. 2. 3. 4. 5. 6. 7. 8. 9. 10. 11. 12.

  8. Bootstrap Web框架

    Bootstrap 一.简介 Bootstrap是美国Twitter公司的设计师Mark Otto和Jacob Thornton合作基于HTML.CSS.JavaScript 开发的简洁.直观.强悍的 ...

  9. 解析ArcGis的字段计算器(三)——文本型字段计算,编号那些事儿

    实际操作中我们一般会将编号字段定义为文本型,因为编号不是序号,序号是一个递增数值,而编号往往是一个数字串代码. 本篇无说明的均使用VBScript语句1.怎么编号?最简单的编号—>直接在编号字段 ...

  10. python实现单向循环链表

    单向循环链表 单链表的一个变形是单向循环链表,链表中最后一个节点的next域不再为None,而是指向链表的头节点. 实现 class Node(object): """节 ...