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. vmware_vcenter_api

    VMware Vcenter_API 介绍 本文主要通过调用Vcenter_API,获取其中的数据中心,集群,主机,网络,存储,虚拟机信息. 开发语言 python 使用官方sdk pyvmomi 文 ...

  2. 运行时错误 429,ACTIVEX部件不能创建对象的解决方法小结

    错误描述: 发布在IIS上面的网站运行时出现如下错误: Microsoft VBscrīpt 运行时错误 错误 '800a01ad' ActiveX 部件不能创建对象 这个错误是asp组件未注册,而导 ...

  3. 在Delphi中获得唯一32位长字符串

    function GetGUID: string; var   vGUID: TGUID;   vTemp:string; begin   if S_OK = CreateGuid(vGUID) th ...

  4. SQLSERVER 修改实例名以及架构信息

    1. GUI的方式 后者是 alter database 的方式修改 instance的名字 2. 在全局的安全性下面创建用户. 3. 在实例的安全性下面创建架构和用户(架构名与用户名一直, 使用新实 ...

  5. 抽奖系统 random()

    random() 方法可返回介于 0 ~ 1 之间的一个随机数. document.write(parseInt(10*Math.random())); //输出0-10之间的随机整数document ...

  6. Spring(1):Spring简介

    一句话概括: Spring是一种轻量级控制反转IoC和面向切面AOP的容器框架 初衷: 使用接口编程而不是类 为javabean提供一个更好的应用配置框架 javabean是一种规范而不是技术.是指符 ...

  7. oracle 慢查询

    一.查询执行最慢的sql select * from (select sa.SQL_TEXT, sa.SQL_FULLTEXT, sa.EXECUTIONS "执行次数", , ) ...

  8. [BJOI2017]树的难题 点分治 线段树

    题面 [BJOI2017]树的难题 题解 考虑点分治. 对于每个点,将所有边按照颜色排序. 那么只需要考虑如何合并2条链. 有2种情况. 合并路径的接口处2条路径颜色不同 合并路径的接口处2条路径颜色 ...

  9. BZOJ 2724 蒲公英 | 分块模板题

    题意 给出一个序列,在线询问区间众数.如果众数有多个,输出最小的那个. 题解 这是一道分块模板题. 一个询问的区间的众数,可能是中间"整块"区间的众数,也可能是左右两侧零散的数中的 ...

  10. 编写shell脚本需要特别关注的注意点

    shell脚本中的条件判断句式 1. if [ condition ];then statement fi 2. If [ condition ];then statement elif [ cond ...