011——VUE中使用object与array控制class
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>使用object与array控制class</title>
<script src="vue.js"></script>
</head>
<body>
<style>
.green{color: green}
.color{
color: red;
}
.font{font-size: 50px;}
</style>
<div id="lantian">
<h1 :class="lt">
科技中国
</h1>
<hr>
<h1 class="green" :class="{color:false}">
科技中国
</h1>
<hr>
<h2 :class="['color','font']">www.baidu.com</h2>
<hr>
<h2 :class="[success,font]">www.baidu.com</h2>
</div>
<script>
var app = new Vue({
el: '#lantian',
data: {
lt:{color:true,font:true},
success:'color',
font:'font'
}
});
</script>
</body>
</html>
011——VUE中使用object与array控制class的更多相关文章
- Vue props中Object和Array设置默认值
Vue中,在props中设置Object和Array的默认值 seller: { type: Object, default() { return {} } } seller: { type: Obj ...
- Vue中Object和Array数据变化侦测原理
在学完Vue.js框架,完成了一个SPA项目后,一直想抽时间找本讲解Vue.js内部实现原理的书来看看,经过多方打听之后,我最后选择了<深入浅出Vue.js>这本书.然而惭愧的是,这本书已 ...
- Vue组件库新增的prop属性类型是Object或者Array时默认值的设置
在Vue开发中提供组件库时常常需要添加相关属性,用来接收父组件向子组件传递的数据,通常也会给属性设置默认值,那么当属性的类型是Object或者Array类型时如何设置默认值比较合理呢?下面将揭晓这一过 ...
- 实现一个函数clone，可以对JS中的5种数据类型（Number、String、Object、Array、Boolean）进行值复制
实现一个函数clone,可以对JS中的5种数据类型(Number.String.Object.Array.Boolean)进行值复制
- js中或者vue中 Object.assign()用法详解
Object.assign()是浅拷贝. 合并对象 var o1 = { a: 1 }; var o2 = { b: 2 }; var o3 = { c: 3 }; var obj = Object. ...
- 实现一个函数clone，使JavaScript中的5种主要的数据类型（包括Number、String、Object、Array、Boolean）进行值复制
实现一个函数clone,可以对JavaScript中的5种主要的数据类型(包括Number.String.Object.Array.Boolean)进行值复制. 1 /** 对象克隆 2 * 支持基本 ...
- PHP中把stdClass Object转array的几个方法
方法一: 复制代码代码如下: //PHP stdClass Object转array function object_array($array) { if(is_object($array)) { $ ...
- [Vue 牛刀小试]：第十二章 - 使用 Vue Router 实现 Vue 中的前端路由控制
一.前言 前端路由是什么?如果你之前从事的是后端的工作,或者虽然有接触前端,但是并没有使用到单页面应用的话,这个概念对你来说还是会很陌生的.那么,为什么会在单页面应用中存在这么一个概念,以及,前端路由 ...
- Vue中控制更新的方式
一. 强制更新的实例方法 vm.$forceUpdate() 迫使 Vue 实例重新渲染.注意它仅仅影响实例本身和插入插槽内容的子组件,而不是所有子组件. 在没有留意到数组或对象的变更检测注意事 ...
随机推荐
- mysql按时间查询（年/月/日）
0.创建表sql语句查询 mysql> show create table byzp_personinfo; CREATE TABLE `byzp_personinfo` ( `id` int( ...
- 利用EasySQLMAIL实现自动数据提取和邮件发送功能 （1）
转自:http://blog.sina.com.cn/s/blog_1549483b70102wioy.html 最近几个月每天都在发通报.过程很繁琐,动作很机械,整个人就是一部机器,执行SQL,填E ...
- Android学习七---Hello OpenCV samples
创建一个能够使用OpenCV JavaCameraView的应用程序来了解基于OpenCV java API 的应用程序的开发流程.有了Android的基础,在程序中需要修改的几个地方1.activi ...
- SQL LEFT JOIN
SQL LEFT JOIN 关键字 SQL LEFT JOIN 关键字 LEFT JOIN 关键字会从左表 (table_name1) 那里返回所有的行,即使在右表 (table_name2) 中没有 ...
- 安装vue-cli脚手架
一.安装node.js 1.什么是node.js? Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境. Node.js 使用了一个事件驱动.非阻塞式 I/O 的模 ...
- 移动app自动化测试
原文出处https://www.toutiao.com/i6473606106970063374/ 原文作者是今日头条的:一个字头的诞生 在此感谢原文作者的无私分享! 移动App自动化测试(一) 目前 ...
- pt-osc测试
pt-osc测试 1.原表必须存在主键 PRIMARY KEY 或者 UNIQUE KEY The new table `darren`.`_t_user_new` does not have a P ...
- 利用SSH协议在Windows下使用PuTTY连接Ubuntu
利用SSH协议在Windows下使用PuTTY连接Ubuntu Ubuntu部分 首先我们要为Ubuntu配置一下环境,让它支持ssh服务,我们要做的其实也很简单,就一下两步: 安装OpenSSH软件 ...
- Maven:如何在eclipse里新建一个Maven的java项目和web项目
如何在eclipse里新建一个Maven的java项目和web项目: 一:java项目 New-->Other-->Maven 右击项目-->properties,修改以下文件: ① ...
- 解析Linux系统的平均负载概念
一.什么是系统平均负载(Load average)? 在Linux系统中,uptime.w.top等命令都会有系统平均负载load average的输出,那么什么是系统平均负载呢?系统平均负载被定义为 ...