解决全选功能,和下面选中不撇配的问题
This commit is contained in:
parent
001bde922c
commit
0a2f0febee
|
@ -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);
|
||||||
|
|
|
@ -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 = [];
|
||||||
|
|
Loading…
Reference in New Issue