data () {

    return {

        img: require('你的json资源路径')

    }

}

:style="{backgroundImage: 'url(' + img + ')'}"

Vue 的style绑定显示background-image的更多相关文章

  1. Vue中class与style绑定

    gitHub地址:https://github.com/lily1010/vue_learn/tree/master/lesson07 一 用对象的方法绑定class 很简单,举个栗子: <!D ...

  2. [js高手之路] vue系列教程 - 绑定class与行间样式style(6)

    一.绑定class属性的方式 1.通过数组的方式,为元素绑定多个class <style> .red { color:red; /*color:#ff8800;*/ } .bg { bac ...

  3. vue class与style绑定、条件渲染、列表渲染

    列表渲染 根据我例子的需要,先来说下,列表渲染使用到的是v-for指令,需要使用 item in items 形式的特殊语法,items 是源数据数组并且 item 是数组元素迭代的别名,具体使用方法 ...

  4. vue学习笔记(三)class和style绑定

    前言 通过上一章的学习vue学习笔记(二)vue的生命周期和钩子函数,我们已经更近一步的知道了关于vue的一些知识,本篇博客将进一步探讨vue其它方面的内容,vue中关于class和style绑定,关 ...

  5. 【Vue】Vue框架常用知识点 Vue的模板语法、计算属性与侦听器、条件渲染、列表渲染、Class与Style绑定介绍与基本的用法

    Vue框架常用知识点 文章目录 Vue框架常用知识点 知识点解释 第一个vue应用 模板语法 计算属性与侦听器 条件渲染.列表渲染.Class与Style绑定 知识点解释 vue框架知识体系 [1]基 ...

  6. 关于vue.js中class与style绑定的学习

    练习代码: html: <!DOCTYPE html><html lang="en"><head> <meta charset=" ...

  7. Vue#Class 与 Style 绑定

    绑定HTMLCLASS 在我没看这之前,我觉得要写绑定class ,应该像绑定数据一样这么写 class ={{class-a}} 看官方教程时,不推荐这么写,推荐这样 v-bind:class=&q ...

  8. Vue.2.0.5-Class 与 Style 绑定

    Class 与 Style 绑定 数据绑定一个常见需求是操作元素的 class 列表和它的内联样式.因为它们都是属性 ,我们可以用v-bind 处理它们:只需要计算出表达式最终的字符串.不过,字符串拼 ...

  9. Vue学习4：class与style绑定

    说明:有些部分我只是相当于做一个学习笔记,加强记忆之用.所以可能阅读性不是那么强.如果有参考我这类博客的人,那么请见谅. 代码如下: <!DOCTYPE html> <html la ...

随机推荐

  1. week4b：个人博客作业

    下面是week4做程序的过程. 1.在做之前先做客户需求,要求使用的使用mul图. 自己第一次听到这个名字,网上查UML为, http://www.cnblogs.com/wangkangluo1/a ...

  2. Java 线程结束 & 守护线程

    /* 停止线程: 1,stop方法. 2,run方法结束. 怎么控制线程的任务结束呢? 任务中都会有循环结构,只要控制住循环就可以结束任务. 控制循环通常就用定义标记来完成. 但是如果线程处于了冻结状 ...

  3. 解决在Mac上用pyenv安装python3失败的问题

    背景 前段时间在本地Mac系统上要跑一个python3写的压测脚本. Mac默认安装的是python2, 而且很多软件依赖的也是python2. 为了不影响现有系统其它软件, 当时安装了pyenv来实 ...

  4. 防止DDoS攻击，每5分钟监控本机的web服务，将目前已经建立连接的IP计算出来，且实现top5。再此基础上，将并发连接超过50的IP禁止访问web服务

    netstat -lntupa | grep ":80" | grep ESTABLISHED | awk '{print $5}' | awk -F: '{print $1}' ...

  5. python基础（六）python操作excel

    一.python操作excel,python操作excel使用xlrd.xlwt和xlutils模块,xlrd模块是读取excel的,xlwt模块是写excel的,xlutils是用来修改excel的 ...

  6. c# 连接操作linux

    0.背景 现在linux重要性是显然易见的,学习linux是必须,通过程序来来控制linux 也能发挥很大的作用.比如我们可以做一个自动化部署的程序,来发布程序到linux上面. 1.在项目中添加SS ...

  7. 理解 Delphi 的类(十一) - 深入类中的方法[8] - 抽象方法与抽象类

    //抽象方法类似与接口; 在没有接口的年代 Delphi 是用抽象方法来模拟接口的; 我想它最终会被接口替代. {下面就定义了两个抽象方法} TMyClass = class(TObject)   p ...

  8. Callable 和 Runnable 的区别

    Callable 和 Runnable 的使用方法大同小异, 区别在于: 1.Callable 使用 call() 方法, Runnable 使用 run() 方法 2.call() 可以返回值, 而 ...

  9. C++ STL 常用拷贝和替换算法

    C++ STL 常用拷贝和替换算法 copy() 复制 vector<int> vecIntA; vecIntA.push_back(1); vecIntA.push_back(3); v ...

  10. MT【130】Heilbronn问题

    (清华THUSSAT,多选题) 平面上 4 个不同点 \(P_1,P_2,P_3,P_4\),在每两个点之间连接线段得到 6 条线段. 记 \[L=\max_{1\leq i<j\leq 4}| ...