diff --git a/components/badge/ScrollNumber.tsx b/components/badge/ScrollNumber.tsx index 70ca0956ef..38d4f91f03 100644 --- a/components/badge/ScrollNumber.tsx +++ b/components/badge/ScrollNumber.tsx @@ -31,8 +31,6 @@ export interface ScrollNumberState { count?: string | number | null; } -let lastCount: any; - class ScrollNumber extends Component { static defaultProps = { count: null, @@ -44,12 +42,13 @@ class ScrollNumber extends Component { if (nextState.count === nextProps.count) { return null; } - lastCount = nextState.count; return { animateStarted: true }; } return null; } + lastCount?: string | number | null; + constructor(props: ScrollNumberProps) { super(props); this.state = { @@ -63,9 +62,9 @@ class ScrollNumber extends Component { return 10 + num; } const currentDigit = getNumberArray(this.state.count)[i]; - const lastDigit = getNumberArray(lastCount)[i]; + const lastDigit = getNumberArray(this.lastCount)[i]; // 同方向则在同一侧切换数字 - if (this.state.count! > lastCount) { + if (Number(this.state.count) > Number(this.lastCount)) { if (currentDigit >= lastDigit) { return 10 + num; } @@ -77,10 +76,11 @@ class ScrollNumber extends Component { return num; } - componentDidUpdate() { + componentDidUpdate(_: any, prevState: ScrollNumberState) { + this.lastCount = prevState.count; if (this.state.animateStarted) { this.setState({ animateStarted: false, count: this.props.count }, () => { - const onAnimated = this.props.onAnimated; + const { onAnimated } = this.props; if (onAnimated) { onAnimated(); } @@ -104,7 +104,7 @@ class ScrollNumber extends Component { renderCurrentNumber(prefixCls: string, num: number, i: number) { const position = this.getPositionByNum(num, i); const removeTransition = - this.state.animateStarted || getNumberArray(lastCount)[i] === undefined; + this.state.animateStarted || getNumberArray(this.lastCount)[i] === undefined; return createElement( 'span', { diff --git a/components/calendar/__tests__/index.test.js b/components/calendar/__tests__/index.test.js index 4722a646a8..b4ce4d3bf9 100644 --- a/components/calendar/__tests__/index.test.js +++ b/components/calendar/__tests__/index.test.js @@ -134,9 +134,9 @@ describe('Calendar', () => { const onPanelChangeStub = jest.fn(); const wrapper = mount(); expect(wrapper.state().mode).toEqual(yearMode); - wrapper.instance().setType('date'); + wrapper.setProps({ mode: monthMode }); expect(wrapper.state().mode).toEqual(monthMode); - expect(onPanelChangeStub).toHaveBeenCalledTimes(1); + expect(onPanelChangeStub).toHaveBeenCalledTimes(0); }); it('Calendar should support locale', () => { diff --git a/components/calendar/index.tsx b/components/calendar/index.tsx index 787e6d0d18..a64ac79d43 100644 --- a/components/calendar/index.tsx +++ b/components/calendar/index.tsx @@ -76,10 +76,14 @@ class Calendar extends React.Component { }; static getDerivedStateFromProps(nextProps: CalendarProps) { + const newState = {} as CalendarState; if ('value' in nextProps) { - return { value: nextProps.value! }; + newState.value = nextProps.value!; } - return null; + if ('mode' in nextProps) { + newState.mode = nextProps.mode; + } + return Object.keys(newState).length > 0 ? newState : null; } prefixCls?: string; @@ -100,14 +104,6 @@ class Calendar extends React.Component { }; } - componentDidUpdate(prevProps: CalendarProps) { - if ('mode' in this.props && this.props.mode !== prevProps.mode) { - this.setState({ - mode: this.props.mode!, - }); - } - } - monthCellRender = (value: moment.Moment) => { const { monthCellRender = noop as Function } = this.props; const { prefixCls } = this; diff --git a/components/form/style/index.less b/components/form/style/index.less index 7fa179794c..a300cb9db2 100644 --- a/components/form/style/index.less +++ b/components/form/style/index.less @@ -105,7 +105,7 @@ input[type='checkbox'] { text-align: left; } - label { + > label { color: @label-color; &::after { diff --git a/components/transfer/index.tsx b/components/transfer/index.tsx index 9f4c6eb01b..2b9117f9dc 100644 --- a/components/transfer/index.tsx +++ b/components/transfer/index.tsx @@ -136,43 +136,7 @@ class Transfer extends React.Component { }; } - componentDidUpdate = (prevProps: TransferProps, prevState: any) => { - const { sourceSelectedKeys, targetSelectedKeys } = prevState; - if ( - prevProps.targetKeys !== this.props.targetKeys || - prevProps.dataSource !== this.props.dataSource - ) { - // clear cached separated dataSource - this.separatedDataSource = null; - - if (!prevProps.selectedKeys) { - // clear key no longer existed - // clear checkedKeys according to targetKeys - const { dataSource, targetKeys = [] } = prevProps; - - const newSourceSelectedKeys: String[] = []; - const newTargetSelectedKeys: String[] = []; - dataSource.forEach(({ key }: { key: string }) => { - if (sourceSelectedKeys.includes(key) && !targetKeys.includes(key)) { - newSourceSelectedKeys.push(key); - } - if (targetSelectedKeys.includes(key) && targetKeys.includes(key)) { - newTargetSelectedKeys.push(key); - } - }); - this.setState({ - sourceSelectedKeys: newSourceSelectedKeys, - targetSelectedKeys: newTargetSelectedKeys, - }); - } - } - }; - separateDataSource(props: TransferProps) { - if (this.separatedDataSource) { - return this.separatedDataSource; - } - const { dataSource, rowKey, targetKeys = [] } = props; const leftDataSource: TransferItem[] = []; @@ -192,12 +156,10 @@ class Transfer extends React.Component { } }); - this.separatedDataSource = { + return { leftDataSource, rightDataSource, }; - - return this.separatedDataSource; } moveTo = (direction: TransferDirection) => {