From c01f45a719702ad44a3b22c70291927962e7eee0 Mon Sep 17 00:00:00 2001 From: AllenFang Date: Sun, 24 Feb 2019 14:56:27 +0800 Subject: [PATCH] fix #789 --- .../src/contexts/selection-context.js | 45 ++++++++--------- .../test/contexts/selection-context.test.js | 49 ++++++++++--------- 2 files changed, 48 insertions(+), 46 deletions(-) diff --git a/packages/react-bootstrap-table2/src/contexts/selection-context.js b/packages/react-bootstrap-table2/src/contexts/selection-context.js index 9c44cff..573c54f 100644 --- a/packages/react-bootstrap-table2/src/contexts/selection-context.js +++ b/packages/react-bootstrap-table2/src/contexts/selection-context.js @@ -14,26 +14,27 @@ class SelectionProvider extends React.Component { keyField: PropTypes.string.isRequired } - state = { selected: this.props.selectRow.selected || [] }; + constructor(props) { + super(props); + this.selected = props.selectRow.selected || []; + } componentWillReceiveProps(nextProps) { if (nextProps.selectRow) { - this.setState(() => ({ - selected: nextProps.selectRow.selected || this.state.selected - })); + this.selected = nextProps.selectRow.selected || this.selected; } } // exposed API getSelected() { - return this.state.selected; + return this.selected; } handleRowSelect = (rowKey, checked, rowIndex, e) => { const { data, keyField, selectRow: { mode, onSelect } } = this.props; const { ROW_SELECT_SINGLE } = Const; - let currSelected = [...this.state.selected]; + let currSelected = [...this.selected]; let result = true; if (onSelect) { @@ -41,18 +42,17 @@ class SelectionProvider extends React.Component { result = onSelect(row, checked, rowIndex, e); } - this.setState(() => { - if (result === true || result === undefined) { - if (mode === ROW_SELECT_SINGLE) { // when select mode is radio - currSelected = [rowKey]; - } else if (checked) { // when select mode is checkbox - currSelected.push(rowKey); - } else { - currSelected = currSelected.filter(value => value !== rowKey); - } + if (result === true || result === undefined) { + if (mode === ROW_SELECT_SINGLE) { // when select mode is radio + currSelected = [rowKey]; + } else if (checked) { // when select mode is checkbox + currSelected.push(rowKey); + } else { + currSelected = currSelected.filter(value => value !== rowKey); } - return { selected: currSelected }; - }); + } + this.selected = currSelected; + this.forceUpdate(); } handleAllRowsSelect = (e, isUnSelect) => { @@ -64,7 +64,7 @@ class SelectionProvider extends React.Component { nonSelectable } } = this.props; - const { selected } = this.state; + const { selected } = this; let currSelected; @@ -81,7 +81,7 @@ class SelectionProvider extends React.Component { dataOperator.getSelectedRows( data, keyField, - isUnSelect ? this.state.selected : currSelected + isUnSelect ? selected : currSelected ), e ); @@ -89,7 +89,8 @@ class SelectionProvider extends React.Component { currSelected = result; } } - this.setState(() => ({ selected: currSelected })); + this.selected = currSelected; + this.forceUpdate(); } render() { @@ -99,7 +100,7 @@ class SelectionProvider extends React.Component { } = getSelectionSummary( this.props.data, this.props.keyField, - this.state.selected + this.selected ); let checkedStatus; @@ -113,7 +114,7 @@ class SelectionProvider extends React.Component { { expect(SelectionContext.Consumer).toBeDefined(); }); - it('should have correct state.data', () => { - expect(wrapper.state().selected).toEqual([]); + it('should have correct this.selected', () => { + expect(wrapper.instance().selected).toEqual([]); }); it('should pass correct sort props to children element', () => { expect(wrapper.length).toBe(1); expect(mockBase).toHaveBeenCalledWith({ ...defaultSelectRow, - selected: wrapper.state().selected, + selected: wrapper.instance().selected, onRowSelect: wrapper.instance().handleRowSelect, onAllRowsSelect: wrapper.instance().handleAllRowsSelect, allRowsNotSelected: true, @@ -104,8 +104,8 @@ describe('DataContext', () => { }); }); - it('should have correct state.selected', () => { - expect(wrapper.state().selected).toEqual(newSelectRow.selected); + it('should have correct this.selected', () => { + expect(wrapper.instance().selected).toEqual(newSelectRow.selected); }); describe('if nextProps.selectRow is not existing', () => { @@ -120,8 +120,8 @@ describe('DataContext', () => { }); }); - it('should keep origin state.selected', () => { - expect(wrapper.state().selected).toEqual(defaultSelected); + it('should keep origin this.selected', () => { + expect(wrapper.instance().selected).toEqual(defaultSelected); }); }); @@ -131,8 +131,8 @@ describe('DataContext', () => { wrapper.instance().componentWillReceiveProps({}); }); - it('should not set state.selected', () => { - expect(wrapper.state().selected).toEqual([]); + it('should not set this.selected', () => { + expect(wrapper.instance().selected).toEqual([]); }); }); }); @@ -148,8 +148,8 @@ describe('DataContext', () => { wrapper = shallow(shallowContext(selectRow)); }); - it('should have correct state.data', () => { - expect(wrapper.state().selected).toEqual(selectRow.selected); + it('should have correct this.selected', () => { + expect(wrapper.instance().selected).toEqual(selectRow.selected); }); }); @@ -164,12 +164,12 @@ describe('DataContext', () => { wrapper = shallow(shallowContext(selectRow)); }); - it('should set state.selected correctly', () => { + it('should set this.selected correctly', () => { wrapper.instance().handleRowSelect(firstSelectedRow, true, rowIndex); - expect(wrapper.state('selected')).toEqual([firstSelectedRow]); + expect(wrapper.instance().selected).toEqual([firstSelectedRow]); wrapper.instance().handleRowSelect(secondSelectedRow, true, rowIndex); - expect(wrapper.state('selected')).toEqual([secondSelectedRow]); + expect(wrapper.instance().selected).toEqual([secondSelectedRow]); }); }); @@ -178,18 +178,19 @@ describe('DataContext', () => { wrapper = shallow(shallowContext()); }); - it('should set state.selected correctly', () => { + it('should set this.selected correctly', () => { wrapper.instance().handleRowSelect(firstSelectedRow, true, rowIndex); - expect(wrapper.state('selected')).toEqual(expect.arrayContaining([firstSelectedRow])); + expect(wrapper.instance().selected).toEqual(expect.arrayContaining([firstSelectedRow])); wrapper.instance().handleRowSelect(secondSelectedRow, true, rowIndex); - expect(wrapper.state('selected')).toEqual(expect.arrayContaining([firstSelectedRow, secondSelectedRow])); + expect(wrapper.instance().selected) + .toEqual(expect.arrayContaining([firstSelectedRow, secondSelectedRow])); wrapper.instance().handleRowSelect(firstSelectedRow, false, rowIndex); - expect(wrapper.state('selected')).toEqual(expect.arrayContaining([secondSelectedRow])); + expect(wrapper.instance().selected).toEqual(expect.arrayContaining([secondSelectedRow])); wrapper.instance().handleRowSelect(secondSelectedRow, false, rowIndex); - expect(wrapper.state('selected')).toEqual([]); + expect(wrapper.instance().selected).toEqual([]); }); }); @@ -220,8 +221,8 @@ describe('DataContext', () => { wrapper.instance().handleAllRowsSelect(e, false); }); - it('should set state.selected correctly', () => { - expect(wrapper.state('selected')).toEqual(data.map(d => d[keyField])); + it('should set this.selected correctly', () => { + expect(wrapper.instance().selected).toEqual(data.map(d => d[keyField])); }); describe('when selectRow.onSelectAll is defined', () => { @@ -237,7 +238,7 @@ describe('DataContext', () => { it('should call selectRow.onSelectAll correctly', () => { expect(onSelectAll).toHaveBeenCalledWith( true, - dataOperator.getSelectedRows(data, keyField, wrapper.state('selected')), + dataOperator.getSelectedRows(data, keyField, wrapper.instance().selected), e ); }); @@ -253,8 +254,8 @@ describe('DataContext', () => { wrapper.instance().handleAllRowsSelect(e, true); }); - it('should set state.selected correctly', () => { - expect(wrapper.state('selected')).toEqual([]); + it('should set this.selected correctly', () => { + expect(wrapper.instance().selected).toEqual([]); }); describe('when selectRow.onSelectAll is defined', () => {