feat: add onChange for Calendar

pull/11525/head
tangjinzhou 7 years ago committed by 偏右
parent b8b9aeb1ce
commit 92dc0dc2b0

@ -44,3 +44,4 @@ When data is in the form of dates, such as schedules, timetables, prices calenda
| value | The current selected date | [moment](http://momentjs.com/) | current date | | value | The current selected date | [moment](http://momentjs.com/) | current date |
| onPanelChange | Callback for when panel changes | function(date: moment, mode: string) | - | | onPanelChange | Callback for when panel changes | function(date: moment, mode: string) | - |
| onSelect | Callback for when a date is selected | function(date: moment | - | | onSelect | Callback for when a date is selected | function(date: moment | - |
| onChange | Callback for when date changes | function(date: moment | - |

@ -36,6 +36,7 @@ export interface CalendarProps {
style?: React.CSSProperties; style?: React.CSSProperties;
onPanelChange?: (date?: moment.Moment, mode?: CalendarMode) => void; onPanelChange?: (date?: moment.Moment, mode?: CalendarMode) => void;
onSelect?: (date?: moment.Moment) => void; onSelect?: (date?: moment.Moment) => void;
onChange?: (date?: moment.Moment) => void;
disabledDate?: (current: moment.Moment) => boolean; disabledDate?: (current: moment.Moment) => boolean;
validRange ?: [moment.Moment, moment.Moment]; validRange ?: [moment.Moment, moment.Moment];
} }
@ -53,6 +54,7 @@ export default class Calendar extends React.Component<CalendarProps, CalendarSta
mode: 'month', mode: 'month',
onSelect: noop, onSelect: noop,
onPanelChange: noop, onPanelChange: noop,
onChange: noop,
}; };
static propTypes = { static propTypes = {
@ -68,6 +70,7 @@ export default class Calendar extends React.Component<CalendarProps, CalendarSta
onPanelChange: PropTypes.func, onPanelChange: PropTypes.func,
value: PropTypes.object, value: PropTypes.object,
onSelect: PropTypes.func, onSelect: PropTypes.func,
onChange: PropTypes.func,
}; };
constructor(props: CalendarProps) { constructor(props: CalendarProps) {
@ -157,10 +160,13 @@ export default class Calendar extends React.Component<CalendarProps, CalendarSta
} }
onPanelChange(value: moment.Moment, mode: CalendarMode | undefined) { onPanelChange(value: moment.Moment, mode: CalendarMode | undefined) {
const { onPanelChange } = this.props; const { onPanelChange, onChange } = this.props;
if (onPanelChange) { if (onPanelChange) {
onPanelChange(value, mode); onPanelChange(value, mode);
} }
if (onChange && value !== this.state.value) {
onChange(value);
}
} }
onSelect = (value: moment.Moment) => { onSelect = (value: moment.Moment) => {

@ -45,3 +45,4 @@ title: Calendar
| value | 展示日期 | [moment](http://momentjs.com/) | 当前日期 | | value | 展示日期 | [moment](http://momentjs.com/) | 当前日期 |
| onPanelChange | 日期面板变化回调 | function(date: moment, mode: string) | 无 | | onPanelChange | 日期面板变化回调 | function(date: moment, mode: string) | 无 |
| onSelect | 点击选择日期回调 | function(date: moment | 无 | | onSelect | 点击选择日期回调 | function(date: moment | 无 |
| onChange | 日期变化回调 | function(date: moment | 无 |

Loading…
Cancel
Save