<div :class="[box,shadow]"></div>

或 :后面跟条件,条件成立则添加class,否则不添加

:class="[{'modelColor2':item.state===1||item.state===2},{'modelColor1':active&&active.includes(item.num)}]"

vue 绑定多个class的更多相关文章

  1. vue 绑定样式的几种方式

    vue 绑定样式 对象语法 1.v-bind:class设置一个对象,动态切换class <div :class="{'active':isActive}">xxx&l ...

  2. $Django 路飞之小知识回顾,Vue之样式element-ui,Vue绑定图片--mounted页面挂载--路由携带参数

    一 小知识回顾 1 级联删除问题 2 一张表关联多个表,比如有manytomanyfileds forignkey,基于对象查询存在的问题:反向查询的时候  表名小写_set.all()不知是哪个字段 ...

  3. NO.04--我的使用心得之使用vue绑定class名

    今天聊一聊这个话题,其实方式有很多种,我今天介绍几种我使用到的,各位看官耐心看: 一.用 变量形式 绑定单个 Class 名 在 vue 中绑定单个 class 名还好说,直接写就可以了 <te ...

  4. Django day 33 vue中使用element-ui的使用,课程的相关介绍,vue绑定图片,课程列表接口,课程详情页面

    一:vue中使用element-ui的使用, 二:课程的相关介绍, 三:vue绑定图片, 四:课程列表接口, 五:课程详情页面

  5. vue绑定数据之前 会看到源代码

    http://blog.csdn.net/fengjingyu168/article/details/72915468 VUE绑定数据闪现问题 问题描述如下: 1.在HTML中使用Vue为div绑定数 ...

  6. 解决vue 绑定事件会覆盖默认参数的问题

    解决vue 绑定事件会覆盖默认参数的问题 在使用一些ui框架的时候,某些组件的框架中的事件所规定的参数不能满足实际开发的需要,但是直接传入参数会把默认的参数覆盖掉 解决方法:将参数放入箭头函数中,传递 ...

  7. vue绑定html的class属性的方法

    一.对象语法绑定class属性 class的属性代码如下 <style type="text/css"> .red{ color: red; width: 100px; ...

  8. vue 绑定属性 绑定Class 绑定style

    <template> <div id="app"> <h2>{{msg}}</h2> <br> <div v-bi ...

  9. vue - 绑定css、style

    1.绑定html css1.1对象语法: 传给 v-bind:class 一个对象,以动态地切换 class <div v-bind:class="{ active: isActive ...

  10. Vue绑定事件,双向数据绑定,只是循环没那么简单

    v-on对象处理 <p @mouseover = "doTish" @mouseout = "doThat"> 对象形式 </p> &l ...

随机推荐

  1. ES6点点点运算符

    1. rest(可变)参数 * 用来取代arguments 但比arguments灵活,只能是最后部分形参参数 function add(...values) { let sum = ; for(va ...

  2. ArrayList集合二

    集合的遍历 通过集合遍历,得到集合中每个元素,这是集合中最常见的操作.集合的遍历与数组的遍历很像,都是通过索引的方式,集合遍历方式如下 13 import java.util.ArrayList; 1 ...

  3. mysql利用st_distance函数查询附近的点的功能

    随着近几年各类移动终端的迅速普及,在手机移动定位app中,附近的人,附近的地点功能十分常见,基于地理位置的服务(LBS)和相关应用也越来越多,而支撑这些应用的最基础技术之一,就是基于地理位置信息的处理 ...

  4. 动态隐藏显示窗口的标题栏(同时保持窗口的sizeable性能

    今天考虑作界面的时候,想去掉窗体的标题栏,但设置 Form.BorderStyle := bsNone; 会导致窗体不可再 Sizeable (通过鼠标操作改变窗体大小),仔细翻看了相关Help也没找 ...

  5. 微信-小程序-开发文档-服务端-模板消息:templateMessage.getTemplateList

    ylbtech-微信-小程序-开发文档-服务端-模板消息:templateMessage.getTemplateList 1.返回顶部 1. templateMessage.getTemplateLi ...

  6. class7_Checkbutton 勾选项

    最终的运行效果(程序见序号3):   #!/usr/bin/env python# -*- coding:utf-8 -*-# ------------------------------------ ...

  7. (转)python之函数介绍及使用

    为什么要用函数? 1.减少代码量 2.保持一致性 3.易维护 一.函数的定义和使用 ? 1 2 3 4 5 6 def test(参数):              ...     函数体     . ...

  8. Codeforces 1174C Ehab and a Special Coloring Problem

    题目链接:http://codeforces.com/problemset/problem/1174/C 题意:给你一个n,要你填充 下标由2 ~ n 的数组ai,要求下标互质的俩个数不能相等,并且数 ...

  9. 剑指offer——10跳台阶演变

    题目描述 一只青蛙一次可以跳上1级台阶,也可以跳上2级……它也可以跳上n级.求该青蛙跳上一个n级的台阶总共有多少种跳法.   题解: 纯找规律题:   class Solution { public: ...

  10. git提交流程简述

    1.初始化:一个项目只执行一次 只要有.git隐藏文件夹就ok了 git init 或者 git clone url 2.为远程github仓库生成别名(remote-name就是远程仓库的别名)这一 ...