有多种方法解决这个问题:

首先,如果使用的是img标签那么可以这样

data () {
return {
img: require('path/to/your/source')
}
} 然后在template中 <img :src="img" />

如果使用的是背景图的方式,那么

 
可以这样

data () {
return {
img: require('path/to/your/source')
}
} <div :style="{backgroundImage: 'url(' + img + ')'}"></div> 或者直接在css中定义 background-image: url('path/to/your/source');

vue中显示静态图片怎么引用的更多相关文章

  1. 周记4——vue中动态添加图片无效、build上线后background-image路径问题

    又是一个周五,又一周要过去了...很开心,这周遇到了vue中的一个比较常见的坑,网上随便一搜就有了很多解决方案...“幸运”的是,我选了一个带坑的方案...所以我觉得有必要记录一下这个“坑中坑”... ...

  2. Android 加载gif图片强大框架(支持预加载、缓存,还支持显示静态图片,一行代码全搞定)

    之前项目中没有涉及到显示gif图片的功能,也没有着重研究过,最近项目中要用到显示gif图片,于是就在网上一顿搜,用过之后发现如下几个缺点. 1.加载大的gif图片会出现oom. 2.没有预加载和缓存功 ...

  3. mfc显示静态图片最简单的方法

    一致都是研究如何调用opencv显示动态图片,但是很多时候在显示图标的时候,都是需要显示静态图片,现在将最简单的方法总结下: 1.添加picture控件 2.添加资源,要求为bmp 3.修改属性 结果 ...

  4. 在InternetExplorer.Application中显示本地图片

    忘记了,喜欢一个人的感觉 Demon's Blog  »  程序设计  »  在InternetExplorer.Application中显示本地图片 « 对VBS效率的再思考——处理二进制数据 Wo ...

  5. vue中动态引入图片为什么要是require, 你不知道的那些事

    相信用过vue的小伙伴,肯定被面试官问过这样一个问题:在vue中动态的引入图片为什么要使用require 有些小伙伴,可能会轻蔑一笑:呵,就这,因为动态添加src被当做静态资源处理了,没有进行编译,所 ...

  6. vue-cil和webpack中本地静态图片的路径问题解决方案

    1 本地图片动态绑定img的src属性 一般我们在html中或者vue组件文件中引用图片是这样,这是不需要做特别处理的 我们将图片放入assets中或者重新建立个文件夹img什么的都可以,随意- 但是 ...

  7. vue-cil 和 webpack 中本地静态图片的路径问题解决方案

    1.小于8K的图片将直接以base64的形式内联在代码中,可以减少一次http请求. 2.大于8k的呢?则直接file-loader打包, 这里并没有写明file-loader.但是确实是需要安装,否 ...

  8. 基于FPGA的VGA显示静态图片

    终于熬到暑假了,记过三四周的突击带考试,终于为我的大二画上了一个完整的句号,接下来终于可以静心去做自己想做的事情了,前一阵子报了一个线上培训班,学学Sobel边缘检测,之前一直在学习图像处理,但是因为 ...

  9. FPGA驱动VGA显示静态图片

    一 .前言 本文设计思想采用明德扬至简设计法.VGA是最常见的视频显示接口,时序也较为简单.本文从利用显示屏通过VGA方式显示测试图案及静态图片着手带大家接触图像显示应用,算是为后续VGA显示摄像头采 ...

随机推荐

  1. C# Web开发中弹出对话框的函数[转载]

    public void Alert(string str_Message) { ClientScriptManager scriptManager =((Page)System.Web.HttpCon ...

  2. Spring Boot 构建电商基础秒杀项目 (三) 通用的返回对象 & 异常处理

    SpringBoot构建电商基础秒杀项目 学习笔记 定义通用的返回对象 public class CommonReturnType { // success, fail private String ...

  3. 在 Web 页面使用 VLC 插件播放 m3u8 视频流 (360 极速模式)

    1. 背景 公司有个旧项目需要添加在线播放 m3u8 视频流,但是该流不知道什么原因使用 Video.js 或 hls.js 均无法播放,最后找到解决方案可使用 VLC 插件播放(360 极速模式下) ...

  4. CentOS 安装git

    git安装 yum install git 初始化git “git init --bare 文件夹” 添加所有 “git add . ” 提交 “git commit -m "提交信息&qu ...

  5. 在 Activity 中实现 getContentView 操作

    2017/9/8 17:17:03   前言     最近接到个需要优化Android原生系统设置APK的任务.这个任务里面有一个更换应用背景图片的需求.我手里的这个设备是一个平板设备,使用了一下这个 ...

  6. Typecho——简介及安装

    Typecho Typecho是由type和echo两个词合成的,来自于开发团队的头脑风暴.Typecho基于PHP5开发,支持多种数据库,是一款内核强健﹑扩展方便﹑体验友好﹑运行流畅的轻量级开源博客 ...

  7. Vue 快速入门

    Vue框架介绍 中文文档: https://cn.vuejs.org/v2/guide/ Vue是一个构建数据驱动的web界面的渐进式框架. 目标是通过尽可能简单的API实现响应式的数据绑定和组合的视 ...

  8. 洛谷P1048采药题解

    题目 这是一个裸的01背包,因为题目中没说可以采好多次,不多说上代码, #include<iostream> using namespace std; int main() { int n ...

  9. 基于Thinkphp5.0 小程序登录插件应用

    资源连接: wulongtao/think-wxminihelper 具体怎么安装,不介绍了,有不懂再问我吧: 主要重点如下: wepy:index.wpy this.$parent.getUserI ...

  10. 洛谷P4581 [BJOI2014]想法(玄学算法,拓扑排序)

    洛谷题目传送门 萝卜大毒瘤 题意可以简化成这样:给一个DAG,求每个点能够从多少个入度为\(0\)的点到达(记为\(k\)). 一个随机做法:给每个入度为\(0\)的点随机一个权值,在DAG上求出每个 ...