From 9567c7829d661021e9d5c181c267e08d6753e5bf Mon Sep 17 00:00:00 2001 From: AllenFang Date: Mon, 24 Sep 2018 16:32:56 +0800 Subject: [PATCH] refactoring shouldComponentUpdate for aggreate and simple row for cell editing --- .../src/contexts/selection-context.js | 2 +- .../src/row/aggregate-row.js | 5 ++-- .../src/row/event-delegater.js | 2 +- .../src/row/should-updater.js | 8 ++++++- .../src/row/simple-row.js | 3 +-- .../test/row/should-updater.test.js | 24 +++++++++++++++---- 6 files changed, 32 insertions(+), 12 deletions(-) diff --git a/packages/react-bootstrap-table2/src/contexts/selection-context.js b/packages/react-bootstrap-table2/src/contexts/selection-context.js index 964b704..ce8d354 100644 --- a/packages/react-bootstrap-table2/src/contexts/selection-context.js +++ b/packages/react-bootstrap-table2/src/contexts/selection-context.js @@ -22,7 +22,7 @@ class SelectionProvider extends React.Component { } } - state = { selected: (this.props.selectRow && this.props.selectRow.selected) || [] }; + state = { selected: this.props.selectRow.selected || [] }; componentWillReceiveProps(nextProps) { if (nextProps.selectRow) { diff --git a/packages/react-bootstrap-table2/src/row/aggregate-row.js b/packages/react-bootstrap-table2/src/row/aggregate-row.js index d176743..1b3df9d 100644 --- a/packages/react-bootstrap-table2/src/row/aggregate-row.js +++ b/packages/react-bootstrap-table2/src/row/aggregate-row.js @@ -31,13 +31,12 @@ export default class RowAggregator extends shouldUpdater(eventDelegater(React.Co this.props.selected !== nextProps.selected || this.props.expanded !== nextProps.expanded || this.props.selectable !== nextProps.selectable || - this.shouldUpdateByWhenEditing(nextProps) || this.shouldUpdatedBySelfProps(nextProps) ) { - this.shouldUpdateRowContent = this.shouldUpdatedByNormalProps(nextProps); + this.shouldUpdateRowContent = this.shouldUpdateChild(nextProps); return true; } - this.shouldUpdateRowContent = this.shouldUpdatedByNormalProps(nextProps); + this.shouldUpdateRowContent = this.shouldUpdateChild(nextProps); return this.shouldUpdateRowContent; } diff --git a/packages/react-bootstrap-table2/src/row/event-delegater.js b/packages/react-bootstrap-table2/src/row/event-delegater.js index 2c6868f..46d2285 100644 --- a/packages/react-bootstrap-table2/src/row/event-delegater.js +++ b/packages/react-bootstrap-table2/src/row/event-delegater.js @@ -45,7 +45,7 @@ export default ExtendBase => } }; - if (DELAY_FOR_DBCLICK) { + if (DELAY_FOR_DBCLICK && selectRow.clickToEdit) { this.clickNum += 1; _.debounce(() => { if (this.clickNum === 1) { diff --git a/packages/react-bootstrap-table2/src/row/should-updater.js b/packages/react-bootstrap-table2/src/row/should-updater.js index f99ff08..7756b73 100644 --- a/packages/react-bootstrap-table2/src/row/should-updater.js +++ b/packages/react-bootstrap-table2/src/row/should-updater.js @@ -3,7 +3,8 @@ import _ from '../utils'; export default ExtendBase => class RowShouldUpdater extends ExtendBase { - shouldUpdateByWhenEditing(nextProps) { + shouldUpdateByCellEditing(nextProps) { + if (!(this.props.clickToEdit || this.props.dbclickToEdit)) return false; return ( nextProps.editingRowIdx === nextProps.rowIndex || (this.props.editingRowIdx === nextProps.rowIndex && @@ -28,4 +29,9 @@ export default ExtendBase => return shouldUpdate; } + + shouldUpdateChild(nextProps) { + return this.shouldUpdateByCellEditing(nextProps) || + this.shouldUpdatedByNormalProps(nextProps); + } }; diff --git a/packages/react-bootstrap-table2/src/row/simple-row.js b/packages/react-bootstrap-table2/src/row/simple-row.js index 02e4bbb..ab5d573 100644 --- a/packages/react-bootstrap-table2/src/row/simple-row.js +++ b/packages/react-bootstrap-table2/src/row/simple-row.js @@ -15,8 +15,7 @@ class Row extends shouldUpdater(eventDelegater(Component)) { shouldComponentUpdate(nextProps) { this.shouldUpdateRowContent = false; - this.shouldUpdateRowContent = - this.shouldUpdateByWhenEditing(nextProps) || this.shouldUpdatedByNormalProps(nextProps); + this.shouldUpdateRowContent = this.shouldUpdateChild(nextProps); if (this.shouldUpdateRowContent) return true; return this.shouldUpdatedBySelfProps(nextProps); diff --git a/packages/react-bootstrap-table2/test/row/should-updater.test.js b/packages/react-bootstrap-table2/test/row/should-updater.test.js index 04a114c..ab1ca05 100644 --- a/packages/react-bootstrap-table2/test/row/should-updater.test.js +++ b/packages/react-bootstrap-table2/test/row/should-updater.test.js @@ -12,8 +12,8 @@ describe('Row shouldUpdater', () => { render() { return null; } } - describe('shouldUpdateByWhenEditing', () => { - describe('when nextProps.editingRowIdx eq props.rowIndex and it\' not null', () => { + describe('shouldUpdateByCellEditing', () => { + describe('when nextProps.clickToEdit and nexrProps.dbclickToEdit both are negative', () => { beforeEach(() => { props = { editingRowIdx: null, @@ -22,15 +22,31 @@ describe('Row shouldUpdater', () => { wrapper = shallow(); }); + it('should always return false', () => { + nextProps = { ...props, editingRowIdx: 0 }; + expect(wrapper.instance().shouldUpdateByCellEditing(nextProps)).toBeFalsy(); + }); + }); + describe('when nextProps.editingRowIdx eq props.rowIndex and it\' not null', () => { + beforeEach(() => { + props = { + clickToEdit: true, + editingRowIdx: null, + rowIndex: 0 + }; + wrapper = shallow(); + }); + it('should return true', () => { nextProps = { ...props, editingRowIdx: 0 }; - expect(wrapper.instance().shouldUpdateByWhenEditing(nextProps)).toBeTruthy(); + expect(wrapper.instance().shouldUpdateByCellEditing(nextProps)).toBeTruthy(); }); }); describe('when props.editingRowIdx eq props.rowIndex but nextProps.editingRowIdx is null', () => { beforeEach(() => { props = { + clickToEdit: true, editingRowIdx: 0, rowIndex: 0 }; @@ -39,7 +55,7 @@ describe('Row shouldUpdater', () => { it('should return true', () => { nextProps = { ...props, editingRowIdx: null }; - expect(wrapper.instance().shouldUpdateByWhenEditing(nextProps)).toBeTruthy(); + expect(wrapper.instance().shouldUpdateByCellEditing(nextProps)).toBeTruthy(); }); }); });