<script src="https://unpkg.com/vue/dist/vue.js"></script>
<style type="text/css">
.blue{ background-color: blue;
}
.green{ background-color: green;
}
div{
width: 400px;
height: 200px;
border-bottom-width: 2px;
}
</style> <div id="container"> <div v-for="item in someData" class="blue" v-bind:class="{'green': item.selected }" @click="green(item)">
点我
</div>
</div> <script> var vm = new Vue({
el: '#container',
data: {
someData: [{"id":1,selected:true},{"id":2,selected:false},{"id":3,selected:true}] },
methods:{
green:function(item){
item.selected=!item.selected;
}
} }) </script>

Vue.js 控制css样式的更多相关文章

  1. JS 控制CSS样式表

    JS控制CSS所使用的方法: <style> .rule{ display: none; } </style> 你想要改变把他的display属性由none改为inline.  ...

  2. 用JS控制CSS基本样式

    详见:http://blog.yemou.net/article/query/info/tytfjhfascvhzxcytp29 用JS控制CSS基本样式的方法 CSS code .class1 { ...

  3. jQuery控制CSS样式

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

  4. js控制div样式显示与隐藏,JS通过点击超链接右边(指定位置)显示一个图标

    原文出自:https://blog.csdn.net/seesun2012 javascript基础篇,老土的方法解决js控制div样式,便于新手理解,粗暴的不能再粗暴,如果你是高手,请忽略! 思路: ...

  5. js设置css样式.

    在js设置css样式做法 var obj = document.getElementById('div'); obj.style.width = '100px'; obj.style.height = ...

  6. php有效的过滤html标签,js代码,css样式标签

    过滤html标签�php中太简单了,我们可以直接使用strip_tags函数来实现了,下面给各位整理了一些关于 strip_tags函数的例子. php过滤html的函数:strip_tags(str ...

  7. 原生js更改css样式的两种方式

    下面我给大家介绍的是原生js更改CSS样式的两种方式: 1通过在javascript代码中的node.style.cssText="css表达式1:css表达式2:css表达式3  &quo ...

  8. 用js控制css属性

    在用js控制css属性时,行内css属性可以任意控制,但若是在<style></style>中写的css属性,均不能用alert读取,但是赋值却有几种现象, 第一种:无法读取, ...

  9. 11-13 js操作css样式

    1.Js操作css样式 Div.style.width=”100px”.在div标签内我们添加了一个style属性,并设定了width值.这种写法会给标签带来大量的style属性,跟实际项目是不符. ...

随机推荐

  1. Mysql常用数据类型归纳总结1

    一直在用Mysql数据库,Mysql的数据类型也最常打交道的.但关于Mysql的一些常用数据类型了解程度仅限于一知半解,仅仅能满足满足于平时一些最简单的操作.而Mysql常用数据类型的定义以及规范理解 ...

  2. 转:PHP删除目录及目录下所有文件

    PHP删除目录及目录下所有文件 <?php //循环删除目录和文件函数 function delDirAndFile( $dirName ) { if ( $handle = opendir(  ...

  3. [考试反思]0927csp-s模拟测试53:沦陷

    很喜欢Yu-shi说过的一句话 在OI里,菜即是原罪 对啊. 都会.谁信呢? 没有分数,你说话算什么呢? 你就是菜,你就是不对,没有别的道理. 最没有用的,莫过于改题大神,这就是菜的借口. 但是其实这 ...

  4. Spring MVC-------文件上传,单文件,多文件,文件下载

    Spring MVC 框架的文件上传是基于 commons-fileupload 组件的文件上传,只不过 Spring MVC 框架在原有文件上传组件上做了进一步封装,简化了文件上传的代码实现,取消了 ...

  5. mybatis调用mysql的存储过程(procedure),实现查询操作(student表中的某个年级中的总人数 select (1) 或者 select (*))

    step1:在mysql cmd中新建存储过程: drop procedure if exists queryCountByGrade ; delimiter // -- 定义存储过程结束符号为// ...

  6. PHP实现日历签到,并实现累计积分功能

    在网站开发过程中我们会经常用到签到功能来奖励用户积分,或者做一些其他活动.这次项目开发过程中做了日历签到,因为没有经验所有走了很多弯路,再次记录过程和步骤. 1.日历签到样式:使用的是calendar ...

  7. [error] hadoop:ls: `.': No such file or directory

    问题: 解决: https://stackoverflow.com/questions/28241251/hadoop-fs-ls-results-in-no-such-file-or-directo ...

  8. 从最近面试聊聊我所感受的.net天花板

    #0 前言 入职新公司没多久,闲来无事在博客园闲逛,看到园友分享的面试经历,正好自己这段时间面试找工作,也挺多感想的,干脆趁这个机会总结整理一下.博主13年开始实习,14年毕业.到现在也工作五六年了. ...

  9. Linux\CentOS 安装 vsftpd 服务器

    安装 查看电脑是否存在 vsftpd 服务器 rmp -qa|grep vsftpd 如果有就删除,没有就使用yum 安装 vsftpd yum -y install vsftpd 配置 在根目录下创 ...

  10. Previous operation has not finished; run 'cleanup' if it was interrupted最简单有效的解决方法

    今天提交代码报错,看了看提示的错误,百度了一下,发现操作都比较繁琐,所以自己重新给一个最简单有效的. 有的要下载sqlite3.exe,借助它清空本地.svn\wc.db数据库文件里面的operati ...