<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <title>Document</title>

    <style>

        .active{

            color: red;

        }

        .active2{

            background: yellow;

        }

    </style>

</head>

<body>

    <!--mvvm里面的v-->

    <div id="app">

        <div :class="{active:color,active2:bgco}">

            你好

        </div>

    </div>

    <script src="./node_modules/vue/dist/vue.js"></script>

    <script >

        //这是mvvm里面的vm

        var vm=new Vue({

            el:'#app',

           //这是mvvm里面的m

            data:{

                color:true,

                bgco:true

            }

        })

    </script>

</body>

</html>

vue中class用法的更多相关文章

  1. checkbox在vue中的用法小结

    关于checkbox多选框是再常见不过的了,几乎很多地方都会用到,这两天在使用vue框架时需要用到checkbox多选功能,实在着实让我头疼,vue和原生checkbox用法不太一样,之前对于vue插 ...

  2. checkbox在vue中的用法总结

    前言 关于checkbox多选框是再常见不过的了,几乎很多地方都会用到,这两天在使用vue框架时需要用到checkbox多选功能,实在着实让我头疼,vue和原生checkbox用法不太一样, 之前对于 ...

  3. 【vue】vue中ref用法

    1.获取当前元素: 例子: <div class="pop pos-a" :style="{ left: pop_x + 'px' ,top: pop_y + 'p ...

  4. swiper在vue中的用法

    首先通过npm i vue-awesome-swiper --save 来在vue中下载插件 然后再main.js中引入 require('swiper/dist/css/swiper.css')im ...

  5. Vue中import用法

    1. 引入第三方插件 第三方常用插件参考https://blog.csdn.net/vbirdbest/article/details/86527886 2. 导入 css 文件 import 'iv ...

  6. Vue中computed用法

    computed是什么?对于任何复杂逻辑,你都应当使用计算属性.computed用来监控自己定义的变量,该变量不在data里面声明,直接在computed里面定义.然后就可以在页面上进行双向数据绑定展 ...

  7. 分享vue中 slot用法

    //slot默认用法 //slot带参数name用法

  8. momentjs在vue中的用法

    js代码 import moment from 'moment'; const jsCountDown = document.getElementById('js-countdown'); const ...

  9. vue中keep-alive的用法

    1.keep-alive的作用以及好处 在做电商有关的项目中,当我们第一次进入列表页需要请求一下数据,当我从列表页进入详情页,详情页不缓存也需要请求下数据,然后返回列表页,这时候我们使用keep-al ...

随机推荐

  1. 【转载】Asp.Net中Cookie对象的作用以及常见属性

    Cookie对象是服务器为用户访问存储的特定信息,这些信息一般存储在浏览器中,服务器可以从提交的数据中获取到相应的Cookie信息,Cookie的最大用途在于服务器对用户身份的确认,即票据认证,用户会 ...

  2. js入门之内置对象Math

    一. 复习数据类型 简单数据类型, 基本数据类型/值类型 Number String Boolean Null Undefined 复杂数据类型 引用类型 Object 数组 数据在内存中是如何存储的 ...

  3. 解决JAVA连接Sybase数据库查询数据乱码的问题

    连接字符串加上charset=eucgb&jconnect_version=0例如:jdbc:sybase:Tds:server:port/database?charset=eucgb& ...

  4. S3C2440 OpenJtag

    C:\Users\Administrator\Desktop>oflash.exe leds.bin +--------------------------------------------- ...

  5. Linux如何监控每个进程所消耗流量

    查看整个系统的网卡流量使用情况 可以参考下这篇总结比较全面的文章 监控具体的某个进程所消耗的流程 首先,Linux没有自带这样的工具,通过这款第三方开源工具,也是比较好用,如果有其他的办法欢迎留言 # ...

  6. 【DRF框架】序列化组件——字段验证

    单个字段的验证 1.在序列化器里定义校验字段的钩子方法   validate_字段 2.获取字段的数据 3.验证不通过,抛出异常  raise serializers.ValidationError( ...

  7. Flutter——Radio组件、RadioListTile组件（单选按钮组件）

    Radio组件 Radio组件的常用属性: 属性 描述 value 单选的值 onChanged 改变时触发 activeColor 选中的颜色.背景颜色 groupValue 选择组的值 impor ...

  8. rabbitmq二进制安装

    一.erland的安装 1.首先测试一下是否已经安装了erlang,命令 rpm -qa | grep erlang 2.没有安装则用yum安装 yum install erlang -y 二.下载r ...

  9. 从excel 导入数据绘制 散点图

    import xlrdimport matplotlib.pyplot as plt bok = xlrd.open_workbook(r'test.xls') sht = bok.sheets()[ ...

  10. 基于Java+Selenium的WebUI自动化测试框架（五）------页面操作实现类

    在编写完Log类和监听类之后,终于要回到正轨上来了.我们继续开始写UIExcutor的实现类. PS:如果你想让你的报告更加美观一些.推荐使用reportNG这个jar包. 在项目中导入reportn ...