全选反选问题

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中的全选反选问题的更多相关文章

  1. 在GridView中实现全选反选的例子

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="GridView控件.asp ...

  2. vue2.0实现在table中实现全选和反选

    其实在去年小颖已经写过一篇:Vue.js实现checkbox的全选和反选 小颖今天在跟着慕课网学习vue的过程中,顺便试试如何在table中实现全选和反选,页面的css样式是直接参考慕课网的样式写的, ...

  3. 关于Winform下DataGridView中实现checkbox全选反选、同步列表项的处理

    近期接手一个winform 项目,虽然之前有.net 的经验,但是对一些控件的用法还不是很熟悉. 这段时间将会记录一些在工作中遇到的坎坷以及对应的解决办法,写出来与大家分享并希望大神提出更好解决方法来 ...

  4. vue2.0在table中实现全选和反选

    其实在去年小颖已经写过一篇:Vue.js实现checkbox的全选和反选 小颖今天在跟着慕课网学习vue的过程中,顺便试试如何在table中实现全选和反选,页面的css样式是直接参考慕课网的样式写的, ...

  5. html中全选反选

    <!--第一层--> <div class="first"> <div class="first_top"> <img ...

  6. JQuery 全选 反选 获取Table 中指定td的元素值

    //全选 function initTableCheckbox() { var $thr = $('table thead tr'); var $checkAllTh = $('<th>& ...

  7. BootStrapt iCheck表单美化插件使用方法详解(含参数、事件等) 全选 反选

    特色: 1.在不同浏览器(包括ie6+)和设备上都有相同的表现 — 包括 桌面和移动设备 2.支持触摸设备 — iOS.Android.BlackBerry.Windows Phone等系统 4.方便 ...

  8. 用javascript实现全选/反选组件

    以下是本人制作的全选/反选 组件,供广大同行参考.指正: 效果如图: 在实现的过程中,全选和全部取消选中这两个功能较为简单,只需用for循环遍历所有复选框为true或false即可.反选也较为简单,也 ...

  9. jquery、js操作checkbox全选反选

    全选反选checkbox在实际应用中比较常见,本文有个不错的示例,大家可以参考下 操作checkbox,全选反选//全选 function checkAll() { $('input[name=&qu ...

随机推荐

  1. C++基础--static的用法

    首先,看看变量的存储: int global ; int main() { int stackStore ; int heapStore* = (int *)malloc(sizeof(int)); ...

  2. JSP + JavaBean + Servlet实现MVC设计模式

    1.流程图: 2.代码清单 数据库脚本: DROP TABLE IF EXISTS `user`; CREATE TABLE `user` ( `userid` ) NOT NULL, `name` ...

  3. 如何开放 Azure 虚拟机 Ping 功能

    前言 文章<使用 PsPing & PaPing 进行 TCP 端口连通性测试>中提到,ICMP 协议的数据包无法通过 Azure 的防火墙和负载均衡器,所以不能直接使用 Ping ...

  4. Consul 配置ACLs

    比如consul.exe 在D:\consul来个json配置文件在 D:\consul\config.jsonjson 格式{ "acl_datacenter": "d ...

  5. SSH免密钥互信及企业案例

    SSH远程免密码:  原理简述:客户端 创建公钥和私钥,公钥是锁,私钥是自己留在客户端的钥匙. 客户端将公钥(锁)发出到服务端,以后自己就能用客户端本地的私钥进行登陆,不用输入密码! 1.客户端,和服 ...

  6. Kubernetes里的secret最基本的用法

    Secret解决了密码.token.密钥等敏感数据的配置问题,使用Secret可以避免把这些敏感数据以明文的形式暴露到镜像或者Pod Spec中. Secret可以以Volume或者环境变量的方式使用 ...

  7. 改写python round()函数,解决四舍五入问题 round(1.365,2)=1.36

    round()函数四舍五入存在一个问题,遇到5不一定进一.如下图所示: print(round(1.365,2)) #1.36 没进一 print('%.2f'%1.365) print(round( ...

  8. python入门8 输入输出

    输入 input() 输出 print() #coding:utf-8 #/usr/bin/python """ 2018-11-03 dinghanhua 输入输出 & ...

  9. 【转载】SSH login without password 免密登陆

    Your aim You want to use Linux and OpenSSH to automate your tasks. Therefore you need an automatic l ...

  10. 转载:em(倍)与px的区别

    转载出处:http://www.cnblogs.com/showker/archive/2010/05/24/1742821.html 在国内网站中,包括三大门户,以及“引领”中国网站设计潮流的蓝色理 ...