全选反选问题

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. flash8中利用遮罩制作图片切换效果

    http://www.56.com/w73/play_album-aid-8642763_vid-NDY5ODU2Mzg.html

  2. Not able to find Java executable or version转载

    转载地址:https://blog.csdn.net/qq_40902122/article/details/79437991 findstr' 不是内部或外部命令,也不是可运行的程序或批处理文件.N ...

  3. list 和 iterate

    list 和 iterate 不同之处 a) list取所有: b) iterate 先取ID,等到用到的时候再根据ID来取对象: c) session 中 list 第二次发出,仍会到数据库查询: ...

  4. maven学习(一)setting.xml配置文件详解

    maven环境搭建: 1.官网下载zip包,解压至任意目录(如:E:\wly\apache-maven-3.2.5) 2.环境变量MAVEN_HOME(E:\wly\apache-maven-3.2. ...

  5. solidity语言11

    函数修饰符 pragma solidity ^0.4.11; contract owned { address owner; // 构造函数 function owned() public { own ...

  6. 1.windows下GIT 服务安装

    本章介绍简单在windows 安装git 服务方法.服务器端采用的是Bonobo Git Server,一款用ASP.NET MVC开发的Git源代码管理工具,界面简洁,基于Web方式配置,简单易用. ...

  7. httpServeltRequest和Model传值的区别

    需要将请求发过来的数据(或者说参数)传递到重定向的页面/转发的页面的时候,就要用到>>model.addAttribute("mine", UserUtils.getC ...

  8. U3

    一个项目里面可以有多个Activity AndroidManifest.xml<intent-filter> <action android:name="android.i ...

  9. JavaScript 经典实例日常收集整理(常用经典)

    作者:阿讯小飞 原文来自:脚本之家 跨浏览器添加事件 //跨浏览器添加事件 function addEvent(obj,type,fn){ if(obj.addEventListener){ obj. ...

  10. 有趣的npx

    在更新 npm 5.2.0 的时候发现会买一送一,自动安装了 npx. npx 会帮你执行依赖包里的二进制文件,也就是说 npx 会自动查找当前依赖包中的可执行文件, 如果找不到,就会去 PATH 里 ...