解决全选功能,和下面选中不撇配的问题

This commit is contained in:
jonyshi 2018-09-19 10:39:03 +08:00
parent 001bde922c
commit 0a2f0febee
2 changed files with 21 additions and 12 deletions

View File

@ -8,7 +8,7 @@
import React, { Component } from 'react'; import React, { Component } from 'react';
import Table from '../../src'; import Table from '../../src';
import multiSelect from "../../src/lib/multiSelect.js"; import multiSelect from "../../src/lib/newMultiSelect.js";
import Checkbox from 'bee-checkbox'; import Checkbox from 'bee-checkbox';
const columns12 = [ const columns12 = [
@ -39,9 +39,9 @@ const columns12 = [
]; ];
const data12 = [ const data12 = [
{ a: "杨过", b: "男", c: 30,d:'内行', key: "2" }, { a: "杨过", b: "男", c: 30,d:'内行', key: "2",_checked:true },
{ a: "令狐冲", b: "男", c: 41,d:'大侠', key: "1" }, { a: "令狐冲", b: "男", c: 41,d:'大侠', key: "1" ,_checked:true},
{ a: "郭靖", b: "男", c: 25,d:'大侠', key: "3" } { a: "郭靖", b: "男", c: 25,d:'大侠', key: "3" ,_checked:true}
]; ];
//拼接成复杂功能的table组件不能在render中定义需要像此例子声明在组件的外侧不然操作state会导致功能出现异常 //拼接成复杂功能的table组件不能在render中定义需要像此例子声明在组件的外侧不然操作state会导致功能出现异常
let MultiSelectTable = multiSelect(Table, Checkbox); let MultiSelectTable = multiSelect(Table, Checkbox);

View File

@ -18,26 +18,35 @@ export default function newMultiSelect(Table, Checkbox) {
constructor(props) { constructor(props) {
super(props); super(props);
let checkedAll = this.setChecked(props.data);
this.state = { this.state = {
checkedAll:false, checkedAll,
// columns:this.getDefaultColumns(props.columns,"init"),
data:ObjectAssign(props.data), data:ObjectAssign(props.data),
} }
} }
componentWillReceiveProps(nextProps){ componentWillReceiveProps(nextProps){
// if(this.props.columns != nextProps.columns){
// this.setState({
// columns:this.getDefaultColumns(nextProps.columns)
// })
// }
if(this.props.data != nextProps.data){ if(this.props.data != nextProps.data){
this.setState({ this.setState({
data:ObjectAssign(nextProps.data) data:ObjectAssign(nextProps.data),
checkedAll:this.setChecked(nextProps.data),
}) })
} }
} }
setChecked(data){
let allCheck = true;
if(data){
for (const da of data) {
if(!da._checked){
allCheck = false;
break;
}
}
}
return allCheck;
}
onAllCheckChange=()=>{ onAllCheckChange=()=>{
let {data,checkedAll} = this.state; let {data,checkedAll} = this.state;
let selectList = []; let selectList = [];