class与computed一起应用
<!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>
.activeColor{
color: red;
}
</style>
<body>
<!--mvvm里面的v-->
<div id="app">
<div :class="setClass">
你好
</div>
</div>
<script src="./node_modules/vue/dist/vue.js"></script>
<script >
//这是mvvm里面的vm
var vm=new Vue({
el:'#app',
//这是mvvm里面的m
data:{
isActive:true,
error:true
},
computed:{
setClass:function(){
return{
activeColor:this.isActive && this.error
}
} }
})
</script> </body>
</html>
class与computed一起应用的更多相关文章
- mobx @computed的解读
写在前面:我一开始看不懂官网的@computed的作用,因为即使我把@computed去掉,依然能正确的report,然后我百度谷歌都找不到答案,下面都是我自己的理解,如果是有问题的,不对的,请务必留 ...
- vue中,class、内联style绑定、computed属性
1.绑定Class ①对象语法 <li :class="{ 'active': activeIdx==0 }" @click="fnClickTab(0)" ...
- redmine computed custom field formula tips
项目中要用到Computed custom field插件,公式不知道怎么写,查了些资料,记录在这里. 1.http://apidock.com/ruby/Time/strftime 查看ruby的字 ...
- Computed read-only property vs function in Swift
In the Introduction to Swift WWDC session, a read-only property description is demonstrated: class V ...
- 用computed返回this.$store.state.count,store更改了,但是computed没有调用
今天出现了这个问题,store更新了,你computed为啥不调用呢??? 另一个.vue更新了state,这个的computed就监听不到了么? 是用这种格式更新的this.$store.commi ...
- KnockoutJS 3.X API 第三章 计算监控属性(4)Pure computed observables
Pure computed observables Pure computed observables是KO在3.2.0版本中推出的.她相对于之前的ComputedObservables有很多改进: ...
- knockout源码分析之computed(依赖属性)
一.序列图 二.主要代码文件 1.dependentObservable.js:主要包含ko.computed相关方法的处理2.dependencyDetection.js:主要包含依赖的监控上下文对 ...
- Knockout 新版应用开发教程之Computed Observables
Computed Observables 如果你有监控属性firstName和lastName的话,此时如果你想要显示全名? 这个时候computed(以前叫做依赖)监控属性就出马了,这是一个函数用来 ...
- Knockout 新版应用开发教程之Observable与computed
KO是什么? KO不是万能的,它的出现主要是为了方便的解决下面的问题: UI元素较多,用户交互比较频繁,需要编写大量的手工代码维护UI元素的状态.样式等属性? UI元素之间关系比较紧密,比如操作一个元 ...
- Vue.js学习 Item5 -- 计算属性computed与$watch
在模板中绑定表达式是非常便利的,但是它们实际上只用于简单的操作.模板是为了描述视图的结构.在模板中放入太多的逻辑会让模板过重且难以维护.这就是为什么 Vue.js 将绑定表达式限制为一个表达式.如果需 ...
随机推荐
- NEST指定id
1.默认以Id属性为Id,无Id属性则自动生成 2.可通过属性标签指定Id [ElasticsearchType(IdProperty = nameof(last_name))] public cla ...
- 快速提交一个项目到github或gitee上
以下步骤假设你已经安装好git 一.Git 全局设置: git config --global user.name "用户名" git config --global user.e ...
- 部署Java项目到阿里云服务器(Ubuntu16.04 64位)
生成Jar包 1.进入到项目所在的路径下,打开cmd命令控制台,使用如下命令打包项目. mvn package --前提将项目中使用的maven配置到系统的环境变量中 2.打包完成的jar包在项目目录 ...
- cell上的按钮点击和左滑冲突
cell上的某个按钮的点击事件,当cell左滑的时候,只要活动的区域也在按钮上,那么按钮的点击事件也会调用. fix: 给按钮添加一个手势(TapGesture)那么当点击的时候就会响应点击手势的方法 ...
- python高并发的详解
一.什么是高并发 高并发(High Concurrency)是互联网分布式系统架构设计中必须考虑的因素之一,它通常是指,通过设计保证系统能够同时并行处理很多请求. 高并发相关常用的一些指标有响应时间( ...
- java学习(1) ----getMethod()和getDeclaredMethod()的区别(转)
转自: https://blog.csdn.net/qq_36443736/article/details/82890011 getMethod():获取自身能用所有的public公共方法.1.类本身 ...
- python学习之flask接口开发,环境变量扩展,网络编程requests
python基础 flask之mock接口 所谓mock接口,其实就是我们在正式接口还没联调或者是测试接口没有正式使用时,自己创建一个模拟接口,来供项目暂时打通功能或者测试流程梳理的桥梁,而我们这儿使 ...
- P2P system: Chord
DHT= Distributed Hash Table store the objects(files) at nodes (hosts, machines) in a cluster. The cl ...
- vscode 输出面板字符编码问题
默认的输出中文会显示成乱码,需要在vscode内部的终端中输入 chcp 65001 缺点是需要每次打开vscode进行激活,另一种方式是在vscode的首选项中进行配置: "termina ...
- [bzoj 3701] Olympic Games (莫比乌斯反演)
题目描述 给出n,m,l,r,modn,m,l,r,modn,m,l,r,mod 表示一个(n+1)∗(m+1)(n+1)*(m+1)(n+1)∗(m+1)的格点图,求能够互相看见的点对个数对modm ...