fix: DatePicker can not change year/month when under control

React 16.4 call getDerivedStateFromProps on every render

close #11447
close #11440
close #11439
close #11416
close #11405
This commit is contained in:
Wei Zhu 2018-07-25 15:42:48 +08:00
parent 36f396f86f
commit b9992f4a08
2 changed files with 17 additions and 5 deletions

View File

@ -5,6 +5,7 @@ import { polyfill } from 'react-lifecycles-compat';
import RangeCalendar from 'rc-calendar/lib/RangeCalendar'; import RangeCalendar from 'rc-calendar/lib/RangeCalendar';
import RcDatePicker from 'rc-calendar/lib/Picker'; import RcDatePicker from 'rc-calendar/lib/Picker';
import classNames from 'classnames'; import classNames from 'classnames';
import shallowequal from 'shallowequal';
import Icon from '../icon'; import Icon from '../icon';
import Tag from '../tag'; import Tag from '../tag';
import warning from '../_util/warning'; import warning from '../_util/warning';
@ -77,8 +78,13 @@ class RangePicker extends React.Component<any, RangePickerState> {
const value = nextProps.value || []; const value = nextProps.value || [];
state = { state = {
value, value,
showDate: getShowDateFromValue(value) || prevState.showDate,
}; };
if (!shallowequal(nextProps.value, prevState.value)) {
state = {
...state,
showDate: getShowDateFromValue(value) || prevState.showDate,
};
}
} }
if (('open' in nextProps) && prevState.open !== nextProps.open) { if (('open' in nextProps) && prevState.open !== nextProps.open) {
state = { state = {

View File

@ -23,14 +23,20 @@ export default function createPicker(TheCalendar: React.ComponentClass): any {
showToday: true, showToday: true,
}; };
static getDerivedStateFromProps(nextProps: PickerProps) { static getDerivedStateFromProps(nextProps: PickerProps, prevState: any) {
let state = null;
if ('value' in nextProps) { if ('value' in nextProps) {
return { state = {
value: nextProps.value, value: nextProps.value,
showDate: nextProps.value,
}; };
if (nextProps.value !== prevState.value) {
state = {
...state,
showDate: nextProps.value,
};
}
} }
return null; return state;
} }
private input: any; private input: any;