1、template 中引用图片，第一个为固定路径，第二个为动态绑定路径

eg：

　　<img src="XXXXXX.png" alt="">
　　<img :src="url" alt="">

当前路径显示为：

第一个图片正常显示，第二个图片无法显示，

解决办法：

2、在return 的 url 下，添加 require()，使其变成 url: require('../../image/user.png') 即可

表示我们的图片要用require引进来，静态资源都要用require引入

vue-cli 动态绑定图片失败的更多相关文章

  1. 解决@vue/cli 创建项目是安装chromedriver时失败的问题

    最近在使用新版vue的命令行工具创建项目时,安装chromedriver老是失败,导致后面的步骤也没有进行.网上搜索了一下,全是使用 工作中常见问题汇总及解决方案 npm install chrome ...

  2. vue动态绑定图片和背景图

    1.动态绑定图片 <img class="binding-img" :src="require('../assets/images/test.png')" ...

  3. vue cli 3.0快速创建项目

    本地安装vue-cli 前置条件 更新npm到最新版本 命令行运行: npm install -g npmnpm就自动为我们更新到最新版本 淘宝npm镜像使用方法 npm config set reg ...

  4. vue cli 3.x 项目部署到 github pages

    github pages 是 github 免费为用户提供的服务,写博客,或者部署一些纯静态项目. 最近将 vue cli 3.x 初始化项目部署到 github pages,踩了一些坑,记录如下. ...

  5. Vue CLI 3+tinymce 5富文本编辑器整合

    基于Vue CLI 3脚手架搭建的项目整合tinymce 5富文本编辑器,vue cli 2版本及tinymce 4版本参考:https://blog.csdn.net/liub37/article/ ...

  6. vue cli 3

    介绍 Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统 通过 @vue/cli 搭建交互式的项目脚手架. 通过 @vue/cli + @vue/cli-service-global 快 ...

  7. Vue Cli安装以及使用

      因为公司项目要用vue框架,所以会用vue-cli来新建项目.用过vue的都知道,要全局安装vue以及脚手架vue-cli,然后执行vue init webpack projectname来新建v ...

  8. Vue CLI 3.x 简单体验

    文档 中文文档 补充于02月10日 vue脚手架的3.x版本已经在开发中,现在还处于alpha版本.我们来看看有哪些变化. 使用 npm install -g @vue/cli 命名方式已经改为npm ...

  9. Vue Cli 3 打包上线 静态资源404问题解决方案

    报错原因:静态资源丢失 解决方案 官方文档https://cli.vuejs.org/zh/config/#vue-config-js baseUrl 从 Vue CLI 3.3 起已弃用,请使用pu ...

随机推荐

  1. 页面可见性判断：document.hidden与visibilitychange事件

    我们需要在特定的时候判断页面的显示状态,例如:当视频加载到可播放状态时,根据用户是否停留在当前页面来决定是否开始自动播放.页面的展示的状态的判断就需要用到html5新增的一个api:document. ...

  2. [iOS]圆形进度条及计时功能

    平时用战网安全令的时候很喜欢圆形倒计时的效果,然后简单看了一下Android的圆形进度条,后来又写了一个IOS的.整体界面参照IOS系统的倒计时功能,顺便熟悉了UIPickerView的一些特性的实现 ...

  3. 将TXT文件 导入 sqlserver数据库

    情景一:​ 数据库已存在旧表名 old_table,列名old_column_name. 将TXT文件导入数据库已存在旧表old_table中,导入过程中需注意 数据源中列名可全部不修改 或 全部修改 ...

  4. ODS设计

    1.数据调研 2.确定数据范围 需要把上端应用需求与ODS数据范围进行验证,以确保应用所需的数据都已经从业务系统中抽取出来,并且得到了很好的组织,以ER模型表示数据主题关系 3.根据数据范围进行进一步 ...

  5. 按ctrl+shift切换不了输入法

    解决方法: 1.在任务栏上的输入法图标上点右键选择设置2.选择键设置,双击第一个“在不同的输入语言之间切换”先勾选“切换输入语言”下面选择左手ALT.取消右边“切换键盘布局”前的勾3.进入“中文(简体 ...

  6. 再谈全局网HBase八大应用场景

    摘要: HBase可以说是一个数据库,也可以说是一个存储.拥有双重属性的HBase天生就具备广阔的应用场景.在2.0中,引入了OffHeap降低了延迟,可以满足在线的需求.引入MOB,可以存储10M左 ...

  7. 2.2Python基础语法（二）之运算符

    返回总目录 目录: 1.Python运算符的分类 2.算数运算符 3.复合运算符 4.比较运算符 5.逻辑运算符 (一)Python运算符的分类: (二)算数运算符: 注意下面三种算数符号: 1.** ...

  8. 更改win系统的鼠标样式

    一.找一个你心仪的鼠标样式(.cur文件),并放到 C:\Windows\Cursors 目录下 二.打开,控制面板 -> 硬件和声音 -> 鼠标 ,如下图: 三.浏览鼠标目录,找到你存放 ...

  9. ES6标准入门之数值的拓展解说

    ES6提供了二进制和八进制数值的新写法,分别用前缀0b(或0B)和0o(或0O)表示. 0b111110111 === 503                    // true 0o767 === ...

  10. Java POI单元格使用心得

    1: /** * Created by liuguangxin on 2018/5/16. * <p> * MergeRegion:表示excel中cell的信息,startRow与end ...