Class绑定v-bind:class
<!DOCTYPE html>
<html lang="zh"> <head>
<title></title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="https://unpkg.com/vue/dist/vue.js"></script>
<link href="../css/style.css" rel="stylesheet"> </head> <body>
<div id="myApp">
<div v-bind:class="{active:isActive}">红色文本1</div>
<div :class="{active:isActive}">红色文本2</div>
<button @click="btnClick">改变class吧</button>
</div>
<script>
var myApp = new Vue({
el: '#myApp',
data: {
isActive: true,
},
methods: {
btnClick: function(){
this.isActive = !this.isActive;
},
},
});
</script>
</body> </html>
Class绑定v-bind:class的更多相关文章
- 背水一战 Windows 10 (21) - 绑定: x:Bind 绑定, x:Bind 绑定之 x:Phase, 使用绑定过程中的一些技巧
[源码下载] 背水一战 Windows 10 (21) - 绑定: x:Bind 绑定, x:Bind 绑定之 x:Phase, 使用绑定过程中的一些技巧 作者:webabcd 介绍背水一战 Wind ...
- 【WIN10】绑定x:Bind
在WP8.WP8中,我们知道有一个绑定{Binding},而在Win10中,新增了一个绑定{x:Bind} x:Bind :为编译时绑定 ,内存.内存相对于传统绑定都有优化 特性: 1.为强类型 ...
- 绑定: x:Bind 绑定, x:Bind 绑定之 x:Phase, 使用绑定过程中的一些技巧
背水一战 Windows 10 之 绑定 x:Bind 绑定 x:Bind 绑定之 x:Phase 使用绑定过程中的一些技巧 示例1.演示 x:Bind 绑定的相关知识点Bind/BindDemo.x ...
- Docker 基础知识 - 使用绑定挂载(bind mounts)管理应用程序数据
绑定挂载(bind mounts)在 Docker 的早期就已经出现了.与卷相比,绑定挂载的功能有限.当您使用绑定挂载时,主机上的文件或目录将挂载到容器中.文件或目录由其在主机上的完整或相对路径引用. ...
- jQuery中事件绑定到bind、live、delegate、on方法的探究
1. 给页面上的某个元素绑定事件,最初采用下面的方式实现: $(‘selector’).click(function(){ //code }); 缺点: 不能同时绑定多个事件,不能绑定动态的元素. 后 ...
- jQuery三种事件绑定方式.bind(),.live(),.delegate()
.bind(), .live(), 和 .delegate()之间的区别并不明显.但是理解它们的不同之处有助于写出更简洁的代码,并防止我们的交互程序中出现没有预料到的bug. 基础 DOM树 首先,图 ...
- jQuery事件绑定方法bind、 live、delegate和on的区别
我们试图绑定一些事件到DOM元素上的时候,我相信上面这4个方法是最常用的.而它们之间到底有什么不同呢?在什么场合下用什么方法是最有效的呢? 1.准备知识 当我们在开始的时候,有些知识是必须具备的: 1 ...
- 事件绑定之.bind()
.bind(eventType[,eventData],handler(eventObject)) 描述:为一个元素绑定一个事件处理程序,bind()绑定方法的时候元素必须已经存在. -eventTy ...
- jQuery中绑定事件bind() on() live() one()的异同
jQuery中绑定事件的四种方法,他们可以同时绑定一个或多个事件 bind()-------------------------版本号小于3.0(在Jquery3.0中已经移除,相应unbind()也 ...
- UWP: 掌握编译型绑定 x:Bind
在 UWP 开发中,我们在进行数据绑定时,除了可以使用传统的绑定 Binding,也可以使用全新的 x:Bind,由于后者是在程序编译时进行初始化操作(不同于 Binding,它是在运行时创建.初始化 ...
随机推荐
- 第四天：语句、表达式与if分支、循环语句
表达式 代码风格 代码格式指南 PEP8 缩进4空格 一行不超过79 空行 赋值语句 基本 (x,y) = (5,10) x [x,y,z] = [1,2,3] x a,b,c = 'uhk' a 5 ...
- 002-Java数据类型
Java数据类型 基本数据类型 和 引用数据类型 基本数据类型 整型:byte - 8bit / short - 2字节 / int - 4字节 / long - 8字节 浮点型:float doub ...
- C++中的指针（*）、引用（&）、const详解（一、定义变量）
一.前言 本人作为一个工作了5年的程序员,程序生涯最初是从c/c++开始的,但是始终不能很熟悉的理解c语言中的指针和c++中的引用,归其原因,一部分自己没有静下心来思考,一部分原因是其自身的复杂性. ...
- lds 文件说明
主要符号说明 OUTPUT_FORMAT(bfdname) 指定输出可执行文件格式. OUTPUT_ARCH(bfdname) 指定输出可执行文件所运行 CPU 平台 ENTRY(symbol) 指定 ...
- Centos7 pxe
yum install dnsmasq mv /etc/dnsmasq.conf /etc/dnsmasq.conf.backup # vim /etc/dnsmasq.conf interface= ...
- LightOJ 1342 Aladdin and the Magical Sticks 期望（结论题）
题目传送门 题意:n根木棍,每根木棍都有一个权值,木棍有可识别的木棍和不可识别的木棍,每次抽取木棍时,会累加权值,如果是可识别的木棍就不放回,不可识别的木棍就放回,问每根木棍至少被抽取一次,权值的期望 ...
- The linux command 之定制提示符
一.提示符分解 默认提示符如下所示: [me@linuxbox ~]$ 可以看出它包括我们的用户名.主机名.当前工作目录.提示符是由PS1变量定义的. [me@linuxbox ~]$ echo $P ...
- 使用Fiddler模拟弱网络环境测试
https://blog.csdn.net/swordgirl2011/article/details/51765237 https://www.cnblogs.com/longronglang/p/ ...
- Nginx启动报错误unlink() “nginx.pid” failed (2: No such file or directory)
在修改了配置文件之后,启动nginx的时候发现,进程已经存在了,但是端口没有监听到. 查看错误日志,有如下错误信息 2015/10/22 21:39:06 [alert] 26434#0: unlin ...
- [JZOJ2865]【集训队互测 2012】Attack
题目 题目大意 平面上有一堆带权值的点.两种操作:交换两个点的权值,查找一个矩形的第\(k\)小 \(N<=60000\) \(M<=10000\) \(10000ms\) 思考历程&am ...