React中的全选反选问题
全选反选问题
1.在state里维护一个数组,例如showArr:[]
2.绑定点击事件的时候将当前这个当选按钮的index加进来
<span className='arrow' onClick={this.showInfo.bind(this,showID)}></span>
3.点击事件showInfo
showInfo(rowID){
let rowArr =this.state.rowArr
rowArr[rowID] =!rowArr[rowID]
this.setState({
rowArr
})
}
最后,就可以快乐的渲染了
<ShowIngo hei={this.state.rowArr[rowID]} />
//当前这个为true就显示,为false就不显示,丝毫不影响其他兄弟,是不是美滋滋
React中的全选反选问题的更多相关文章
- 在GridView中实现全选反选的例子
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="GridView控件.asp ...
- vue2.0实现在table中实现全选和反选
其实在去年小颖已经写过一篇:Vue.js实现checkbox的全选和反选 小颖今天在跟着慕课网学习vue的过程中,顺便试试如何在table中实现全选和反选,页面的css样式是直接参考慕课网的样式写的, ...
- 关于Winform下DataGridView中实现checkbox全选反选、同步列表项的处理
近期接手一个winform 项目,虽然之前有.net 的经验,但是对一些控件的用法还不是很熟悉. 这段时间将会记录一些在工作中遇到的坎坷以及对应的解决办法,写出来与大家分享并希望大神提出更好解决方法来 ...
- vue2.0在table中实现全选和反选
其实在去年小颖已经写过一篇:Vue.js实现checkbox的全选和反选 小颖今天在跟着慕课网学习vue的过程中,顺便试试如何在table中实现全选和反选,页面的css样式是直接参考慕课网的样式写的, ...
- html中全选反选
<!--第一层--> <div class="first"> <div class="first_top"> <img ...
- JQuery 全选 反选 获取Table 中指定td的元素值
//全选 function initTableCheckbox() { var $thr = $('table thead tr'); var $checkAllTh = $('<th>& ...
- BootStrapt iCheck表单美化插件使用方法详解(含参数、事件等) 全选 反选
特色: 1.在不同浏览器(包括ie6+)和设备上都有相同的表现 — 包括 桌面和移动设备 2.支持触摸设备 — iOS.Android.BlackBerry.Windows Phone等系统 4.方便 ...
- 用javascript实现全选/反选组件
以下是本人制作的全选/反选 组件,供广大同行参考.指正: 效果如图: 在实现的过程中,全选和全部取消选中这两个功能较为简单,只需用for循环遍历所有复选框为true或false即可.反选也较为简单,也 ...
- jquery、js操作checkbox全选反选
全选反选checkbox在实际应用中比较常见,本文有个不错的示例,大家可以参考下 操作checkbox,全选反选//全选 function checkAll() { $('input[name=&qu ...
随机推荐
- PLSQL Developer乱码
1.select * from v$nls_parameters 查询nls的参数,获得数据库服务器端的字符编码 NLS_LANGUAGE NLS_CHARACTERSET 2.修改本地环境变量,设置 ...
- PHP header() session_start() 函数前为什么不能有输出?
前阵面试遇到的问题,当时没答上来,后来查了些资料,仍未得到答案.今天研究HTTP请求,终于知道了答案. HTTP 函数允许在其他输出被发送之前,对由 Web 服务器发送到浏览器的信息进行操作. HTT ...
- 安全隐患,你对X-XSS-Protection头部字段理解可能有误
0×00. 引言 我曾做过一个调查,看看网友们对关于X-XSS-Protection 字段的设置中,哪一个设置是最差的,调查结果令我非常吃惊,故有此文. 网友们认为 最差的配置是X-XSS-Prote ...
- Lucene.net入门学习(结合盘古分词)(转载)
作者:释迦苦僧 出处:http://www.cnblogs.com/woxpp/p/3972233.html 本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显 ...
- 在Centos 7上安装Docker
在Centos 7上安装Docker 1.docker介绍 docker是类似于vmware的虚拟化软件,可以开发.容纳.运行应用程序的平台,在容器中安全的隔离运行应用程序. 2.Docker引擎 D ...
- 【java开发系列】—— 深克隆和浅克隆
Java支持我们对一个对象进行克隆,通常用在装饰模式和原型模式中.那么什么是深克隆,什么是浅克隆呢. [浅克隆],通常只是对克隆的实例进行复制,但里面的其他子对象,都是共用的. [深克隆],克隆的时候 ...
- 使用字面量或者绑定变量在HANA Studio里执行SQL语句
在SAP note 2000002 – FAQ: SAP HANA SQL Optimization里提到了SQL语句的两种执行方式,具体差异体现在where语句里搜索条件的指定方式上. 所谓Lite ...
- selenium:IE浏览器获取cookie提示Could not retrieve cookies
from selenium import webdriver url = "https://www.baidu.com" dr = webdriver.Ie() dr.get(ur ...
- BZOJ 2002: [Hnoi2010]Bounce 弹飞绵羊 【分块】
任意门:https://www.lydsy.com/JudgeOnline/problem.php?id=2002 2002: [Hnoi2010]Bounce 弹飞绵羊 Time Limit: 10 ...
- 2018.9.30 Java中数组的存储与内存分配
java 数组与集合的区别 集合:长度可变,可以存放不同类型的元素,只能存放引用类型! 数组:长度固定,只可以存放相同的同种类型的元素,可以存放数据类型也可以存放引用类型! 数组定义的三种方式 // ...