全选反选问题

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. JavaScript中双叹号(!!)作用

    经常看到这样的例子: var a: var b=!!a a默认是undefined.!a是true,!!a则是false,所以b的值是false,而不再是undefined,也非其它值,主要是为后续判 ...

  2. jQuery登录倒计时

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script sr ...

  3. 30 Excellent WordPress Video Tutorials

    http://sixrevisions.com/wordpress/30-excellent-wordpress-video-tutorials/ WordPress是一种使用PHP语言开发的博客平台 ...

  4. MicroService

  5. CSS3中的变形与动画(一)

    CSS3变形篇 旋转rotate() 旋转rotate()函数通过指定的角度参数使元素相对原点进行旋转.它主要在二维空间内进行操作,设置一个角度值,用来指定旋转的幅度.如果这个值为正值,元素相对原点中 ...

  6. Python装饰器AOP 不定长参数 鸭子类型 重载(三)

    1 可变长参数与关键字参数 *args代表任意长度可变参数 **kwargs代表关键字参数 用*args和**kwargs只是为了方便并没有强制使用它们. 缺省参数即是调用该函数时,缺省参数的值若未被 ...

  7. jquery表单

    <!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8" ...

  8. mongorc.js文件

    当启动的时候,mongo检查用户HOME目录下的一个JavaScript文件.mongorc.js.如果找到,mongo在首次显示提示信息前解析.mongorc.js的内容.如果你使用shell执行一 ...

  9. MySQL:数据库入门篇1

    1,什么是数据库?——存储数据的仓库 数据库技术是计算机应用领域中非常重要的技术,它产生于20世纪60年代末,是数据管理的最新技术,也是软件技术的一个重要分支. 简单的说,数据库就是一个存放数据的仓库 ...

  10. 2018中国大学生程序设计竞赛 - 网络选拔赛 1009 - Tree and Permutation 【dfs+树上两点距离和】

    Tree and Permutation Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/65536 K (Java/Oth ...