<!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. Django_rest_framework分页

    分页基本流程及配置 1.基于LimitOffsetPagination做分页,根据配置 from rest_framework.pagination import LimitOffsetPaginat ...

  2. @app.route源码流程分析

    @app.route(), 是调用了flask.app.py文件里面的Flask类的route方法,route方法所做的事情和add_url_rule类似,是用来为一个URL注册一个视图函数,但是我们 ...

  3. S3C2440 块设备（待续）

    1.块设备只能以块为单位接受输入和返回输出,而字符设备则以字节为单位 2.块设备对于I/O请求有对应的缓冲区,因此他们可以选择以什么顺序进行响应,字符设备无须缓冲且被直接读写.对于存储设备而言调整读写 ...

  4. MVC-Application

    Application简述(不如Cache) 在asp.net环境下,Application对象来自HttpApplictionStat类.它可以在多个请求.连接之间共享公用信息,也可以在各个请求连接 ...

  5. C++——static & const

    静态成员 由关键字static修饰说明的类成员,称为静态类成员(static class member).虽然使用static修饰说明,但与函数中的静态变量有明显差异.类的静态成员为其所有对象共享,不 ...

  6. Nginx服务rewrite模块功能说明 网站自动跳转功能

    实现域名地址信息跳转,用于做伪静态地址 www.impkk.com/oldboy?edu.html 动态地址 www.impkk.com/oldboy-edu.html 伪静态地址 rewrite ^ ...

  7. Gym - 102346D Denouncing Mafia 取k叶子节点使叶子到根覆盖节点数最大

    给你一棵树 你可以取K条链 一条链为根到叶子的路径 问你K条链最多覆盖树上多少个节点 贪心的做 肯定是每次取最长链 但是取完最长链 一颗树就会变为若干个森林 我们要维护当前所有森林里的最长链 ans数 ...

  8. webpack4 打包优化

    1 参考文章 彻底解决 webpack 打包文件体积过大 webpack4提升180%编译速度 详解webpack4之splitchunksPlugin代码包分拆 webpack v4 中的断舍离 开 ...

  9. 2018 南京网络预赛Sum ——莫比乌斯反演

    题意 设 $f(n)$ 为 $n=ab$ 的方案数,其中 $a,b$ 为无平方因子数.求 $\displaystyle  \sum_{i=1}^nf(i)$,$n \leq 2e7$. 分析 显然,可 ...

  10. python pip获取所有已安装的第三包

    pip freeze > requirements.txt # 生成txt 文件 pip install -r requirements.txt # 别人使用时可以直接安装所有的包 [progr ...