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. ABP ModuleZero 添加角色_创建角色是报错的问题解决方案

    ABP升级后,大概3.6.1以后,在.net framework里面,从官方下载的Module zero模板添加角色是出现下面错误. 这个问题,算是新版apb的一点小缺憾,好像在.net core的模 ...

  2. json对象与json字符串的区别

    最近糟了这个坑,同一个方法,android和ios返回的数据不一样,一个是json字符串,另一个是json对象(至于为什么后台返回的是json对象,还没找到原因,但是我看到的后台的代码是有在返回之前给 ...

  3. 学习laravel源码之中间件原理

    刨析laravel源码之中间件原理 在看了laravel关于中间件的源码和参考了相关的书籍之后,写了一个比较简陋的管道和闭包实现,代码比较简单,但是却不好理解所以还是需要多写多思考才能想明白其中的意义 ...

  4. Powershell笔记之help about_XXX

    <<about_Arrays>> 1. 一直好奇gettype()输出中的Name这一列的Object[]是什么意思,现在终于明白了,请看下面的例子: 2. GM的不同用法 $ ...

  5. SpringBoot(七)_统一异常处理

    我感觉看了这节课,给我的思考还是很多的,感觉受益良多.废话不多说,一起学习. 统一的 外层结构返回 这样利于代码看着也规范,前端处理也统一 # 错误返回 { "code": 1, ...

  6. CKEditor 4 & markdown & rich text editor

    CKEditor 4 ckeditor 4 http://ckeditor.com

  7. java异常处理-finally中使用return和throw语句

    java异常语句中的finally块通常用来做资源释放操作,如关闭文件.关闭网络连接.关闭数据库连接等.正常情况下finally语句中不应该使用return语句也不应该抛出异常,以下讨论仅限于java ...

  8. Windows系统下搭建Appium自动化测试框架

    简介 一种开源的测试框架(http://appium.io/) 能够用来测试原生Android/iOS应用.混合应用以及webapp 通过webdriver协议来操作应用,其核心是一个web服务器,接 ...

  9. 【大数据】关于Kafka的进一步理解

    前置: 文件host 192.168.11.13 192.168.11.14 192.168.11.30 脚本init_kafka.sh #!/bin/bash source /etc/profile ...

  10. 修改grub需要修改权限命令

    Ubantu每次更新都会把用于引导的grub文件重置,导致开机后,又找不到系统,看来以后还是要备份一下grub文件.另外,这周开始学习python,先学习Linux系统的命令行操作,很多操作是相通的. ...