全选反选问题

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. PLSQL Developer乱码

    1.select * from v$nls_parameters 查询nls的参数,获得数据库服务器端的字符编码 NLS_LANGUAGE NLS_CHARACTERSET 2.修改本地环境变量,设置 ...

  2. PHP header() session_start() 函数前为什么不能有输出?

    前阵面试遇到的问题,当时没答上来,后来查了些资料,仍未得到答案.今天研究HTTP请求,终于知道了答案. HTTP 函数允许在其他输出被发送之前,对由 Web 服务器发送到浏览器的信息进行操作. HTT ...

  3. 安全隐患,你对X-XSS-Protection头部字段理解可能有误

    0×00. 引言 我曾做过一个调查,看看网友们对关于X-XSS-Protection 字段的设置中,哪一个设置是最差的,调查结果令我非常吃惊,故有此文. 网友们认为 最差的配置是X-XSS-Prote ...

  4. Lucene.net入门学习(结合盘古分词)(转载)

    作者:释迦苦僧  出处:http://www.cnblogs.com/woxpp/p/3972233.html  本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显 ...

  5. 在Centos 7上安装Docker

    在Centos 7上安装Docker 1.docker介绍 docker是类似于vmware的虚拟化软件,可以开发.容纳.运行应用程序的平台,在容器中安全的隔离运行应用程序. 2.Docker引擎 D ...

  6. 【java开发系列】—— 深克隆和浅克隆

    Java支持我们对一个对象进行克隆,通常用在装饰模式和原型模式中.那么什么是深克隆,什么是浅克隆呢. [浅克隆],通常只是对克隆的实例进行复制,但里面的其他子对象,都是共用的. [深克隆],克隆的时候 ...

  7. 使用字面量或者绑定变量在HANA Studio里执行SQL语句

    在SAP note 2000002 – FAQ: SAP HANA SQL Optimization里提到了SQL语句的两种执行方式,具体差异体现在where语句里搜索条件的指定方式上. 所谓Lite ...

  8. selenium:IE浏览器获取cookie提示Could not retrieve cookies

    from selenium import webdriver url = "https://www.baidu.com" dr = webdriver.Ie() dr.get(ur ...

  9. BZOJ 2002: [Hnoi2010]Bounce 弹飞绵羊 【分块】

    任意门:https://www.lydsy.com/JudgeOnline/problem.php?id=2002 2002: [Hnoi2010]Bounce 弹飞绵羊 Time Limit: 10 ...

  10. 2018.9.30 Java中数组的存储与内存分配

    java 数组与集合的区别 集合:长度可变,可以存放不同类型的元素,只能存放引用类型! 数组:长度固定,只可以存放相同的同种类型的元素,可以存放数据类型也可以存放引用类型! 数组定义的三种方式 // ...