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. python学习笔记之——操作mysql数据库

    Python 标准数据库接口为 Python DB-API,Python DB-API为开发人员提供了数据库应用编程接口. Python 数据库接口支持非常多的数据库,你可以选择适合你项目的数据库: ...

  2. 语义slam用于高精地图和高精定位的一些想法

    最近一直在考虑语义slam在自动驾驶和辅助驾驶中的用法,研究了一下视觉为主的高精度地图+高精定位的模式,特别是mobileye的REM. 秉承先建图再定位的思路,在服务器端(云端)建图,在车端定位. ...

  3. 排错-Error--memory violation  Exception ACCESS_VIOLATION received解决方

    Error -- memory violation : Exception ACCESS_VIOLATION received   by:授客 QQ:1033553122 测试代码: Action() ...

  4. maven一模块字段调用另一个模块数据生成下拉框

    店铺运营数据录入表实现的下拉框实现 从片区管理中提取分区数据,在招商管理(MIS)模块中获取并以下拉框的形式展现 ctrl类: 1.首先在ctrl类注入需提取另一模块字段的serviceclient接 ...

  5. Android IOC注解库EasyUI

    EasyUI介绍 1.使用反射机制和注解实现类似于butterknife的IOC框架 2.快速的findViewById和OnClick 3.扩展了click时无网络监测 4.扩展了快速点击监测 使用 ...

  6. Percona MySQL5.7内存OOM案例导致重启的memory和thread分析

    前言 在一个阳光明媚的下午,电脑右下角传来一片片邮件提醒,同时伴随着微信钉钉的震动,打开一看,应用各种出错,天兔告警,数据库服务器内存爆红,Mysql数据库实例挂掉了. 排查 先交代一下数据库版本: ...

  7. Gmail 设置,时区

    问题提出: 我们工作的时候,需要和不同时区的人进行合作.我们需要注意时区问题.如果没有设置好时区,会造成很多不便. 了解时区问题: 通过 这个网站可以,让你对时区有所了解:http://zh.thet ...

  8. 插入算法---java实现

    插入排序java代码实现 package algorithms.插入排序; import java.io.BufferedReader; import java.io.InputStreamReade ...

  9. spring-bean 版本的问题(报错:org.xml.sax.SAXParseException; lineNumber: 14; columnNumber: 75;)

    当XML中配置的xsd是4.0,而引用的包是4以下的spring-bean.jar时,当服务器能连网时没问题,不能连网时,就报以下类似错误: org.xml.sax.SAXParseException ...

  10. linux 文本操作

    sed -i 直接修改 sed 是负责插入替换删除字符串操作. sed -n '/11/p' 11.txt |sed  's/11/33333/g'  查找11并替换11位3333 sed  's/1 ...