ant-design/components/table/SelectionCheckboxAll.tsx
Wei Zhu d7a110552b Don't use index as row key. (#4185)
* Ensure warning if key is undefined.

* Ensure getRecordKey receives index

* Remove rowKey's second parameter from doc.
2016-12-16 17:53:08 +08:00

123 lines
3.0 KiB
TypeScript

import React from 'react';
import Checkbox from '../checkbox';
import { Store } from './createStore';
export interface SelectionCheckboxAllProps {
store: Store;
disabled: boolean;
getCheckboxPropsByItem: (item, index) => any;
getRecordKey: (record, index?) => string;
data: any[];
onChange: (e) => void;
}
export default class SelectionCheckboxAll extends React.Component<SelectionCheckboxAllProps, any> {
unsubscribe: () => void;
constructor(props) {
super(props);
this.state = {
checked: this.getCheckState(props),
indeterminate: this.getIndeterminateState(props),
};
}
componentDidMount() {
this.subscribe();
}
componentWillReceiveProps(nextProps) {
this.setCheckState(nextProps);
}
componentWillUnmount() {
if (this.unsubscribe) {
this.unsubscribe();
}
}
subscribe() {
const { store } = this.props;
this.unsubscribe = store.subscribe(() => {
this.setCheckState(this.props);
});
}
checkSelection(data, type, byDefaultChecked) {
const { store, getCheckboxPropsByItem, getRecordKey } = this.props;
// type should be 'every' | 'some'
if (type === 'every' || type === 'some') {
return (
byDefaultChecked
? data[type]((item, i) => getCheckboxPropsByItem(item, i).defaultChecked)
: data[type]((item, i) =>
store.getState().selectedRowKeys.indexOf(getRecordKey(item, i)) >= 0)
);
}
return false;
}
setCheckState(props) {
const checked = this.getCheckState(props);
const indeterminate = this.getIndeterminateState(props);
if (checked !== this.state.checked) {
this.setState({ checked });
}
if (indeterminate !== this.state.indeterminate) {
this.setState({ indeterminate });
}
}
getCheckState(props) {
const { store, data } = props;
let checked;
if (!data.length) {
checked = false;
} else {
checked = store.getState().selectionDirty
? this.checkSelection(data, 'every', false)
: (
this.checkSelection(data, 'every', false) ||
this.checkSelection(data, 'every', true)
);
}
return checked;
}
getIndeterminateState(props) {
const { store, data } = props;
let indeterminate;
if (!data.length) {
indeterminate = false;
} else {
indeterminate = store.getState().selectionDirty
? (
this.checkSelection(data, 'some', false) &&
!this.checkSelection(data, 'every', false)
)
: ((this.checkSelection(data, 'some', false) &&
!this.checkSelection(data, 'every', false)) ||
(this.checkSelection(data, 'some', true) &&
!this.checkSelection(data, 'every', true))
);
}
return indeterminate;
}
render() {
const { disabled, onChange } = this.props;
const { checked, indeterminate } = this.state;
return (
<Checkbox
checked={checked}
indeterminate={indeterminate}
disabled={disabled}
onChange={onChange}
/>
);
}
}