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 ...
随机推荐
- Eclipse Startup
First of all, we take a look at class EclipseStarter /********************************************** ...
- 【Linux】TFTP & NFS 服务器配置
Why?--交叉开发 一.交叉开发模型 宿主机(PC)------ 网络.串口.USB.JTAG ------ 目标机(ARM系统) PC机作为TFTP & NFS 服务器,目标机从网络下载软 ...
- PHP 运用rsa加密和解密实例
1.加密解密的第一步是生成公钥.私钥对,私钥加密的内容能通过公钥解密(反过来亦可以) 下载开源RSA密钥生成工具openssl(通常Linux系统都自带该程序),解压缩至独立的文件夹,进入其中的bin ...
- Java 创建 ARM 虚拟机磁盘类型选择的问题
问题描述 在Azure 门户创建 ARM 虚拟机时,我们直接可以选择虚拟机的磁盘类型,但是在 Azure Management Libraries for Java 的 API 中我们无法找到直接设置 ...
- mysql使用mysqld_multi工具启动多实例
先给出实验环境/etc/my.cnf文件内容修改内容为:添加了[mysqld_multi]标签和多出来两个数据库的标签[mysqld3307]和[mysqld3308]配置完成后启动方法,举一例:my ...
- May 28th 2017 Week 22nd Sunday
Behind every beautiful thing, there's some kind of pain. 美丽背后,必有某种努力. No pains, no gains. Maybe we n ...
- codefind.pl
#!/usr/bin/perl # # Find a pattern in a the book's source collection (DOS/Windows version) # # (C) C ...
- 第二次团队Scrum
长大一条龙之登录注册 一.设计详情 本次冲刺我们团队实现了长大一条龙的登录注册功能,我们的这个项目严格遵守MVC架构,采用前后端分离的策略.我们将登录注册分为二层,DAO层:负责与数据进行交互,读写数 ...
- 关于rapidxml无法解析中文路径问题
先放结果 setlocale(LC_ALL, ""); rapidxml::file<> f(szPath); setlocale(LC_ALL, "C&qu ...
- IDEA tomcat热部署方法及乱码问题解决
在项目开发过程中,我们一般希望在修改完代码之后不重启项目即可提现出修改的结果,那么热部署项目就显得十分必要了.在idea中将项目热部署至tomcat中的方法如下: 首先打开tomcat配置界面,在se ...