diff --git a/demo/demolist/Demo12.js b/demo/demolist/Demo12.js index 3e13e15..374f629 100644 --- a/demo/demolist/Demo12.js +++ b/demo/demolist/Demo12.js @@ -8,7 +8,7 @@ import React, { Component } from 'react'; import Table from '../../src'; -import multiSelect from "../../src/lib/multiSelect.js"; +import multiSelect from "../../src/lib/newMultiSelect.js"; import Checkbox from 'bee-checkbox'; const columns12 = [ @@ -39,9 +39,9 @@ const columns12 = [ ]; const data12 = [ - { a: "杨过", b: "男", c: 30,d:'内行', key: "2" }, - { a: "令狐冲", b: "男", c: 41,d:'大侠', key: "1" }, - { a: "郭靖", b: "男", c: 25,d:'大侠', key: "3" } + { a: "杨过", b: "男", c: 30,d:'内行', key: "2",_checked:true }, + { a: "令狐冲", b: "男", c: 41,d:'大侠', key: "1" ,_checked:true}, + { a: "郭靖", b: "男", c: 25,d:'大侠', key: "3" ,_checked:true} ]; //拼接成复杂功能的table组件不能在render中定义,需要像此例子声明在组件的外侧,不然操作state会导致功能出现异常 let MultiSelectTable = multiSelect(Table, Checkbox); diff --git a/src/lib/newMultiSelect.js b/src/lib/newMultiSelect.js index 05ef1a5..3db7ea2 100644 --- a/src/lib/newMultiSelect.js +++ b/src/lib/newMultiSelect.js @@ -18,26 +18,35 @@ export default function newMultiSelect(Table, Checkbox) { constructor(props) { super(props); + let checkedAll = this.setChecked(props.data); this.state = { - checkedAll:false, - // columns:this.getDefaultColumns(props.columns,"init"), + checkedAll, data:ObjectAssign(props.data), } } componentWillReceiveProps(nextProps){ - // if(this.props.columns != nextProps.columns){ - // this.setState({ - // columns:this.getDefaultColumns(nextProps.columns) - // }) - // } if(this.props.data != nextProps.data){ 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=()=>{ let {data,checkedAll} = this.state; let selectList = [];