只能选择同一天的datePicker

//moment().dayOfYear()一年中的第几天

 1 import { DatePicker } from 'antd';
 2 
 3 class DateRange extends React.Component {
 4   state = {
 5     endOpen: false,
 6     formValues: { 
 7       strDate: null, 
 8       endDate: null
 9     },
10   };
11 
12     disabledStartDate = strDate => {
13     const { formValues: {endDate} } = this.state;
14     if (!strDate || !endDate) {
15       return false;
16     }
17     return moment(strDate).dayOfYear() !== moment(endDate).dayOfYear();
18   };
19 
20   disabledEndDate = endDate => {
21     const { formValues:{strDate} } = this.state;
22     if (!endDate || !strDate) {
23       return false;
24     }
25     return moment(strDate).dayOfYear() !== moment(endDate).dayOfYear();
26   };
27 
28   onChange = (field, value) => {
29     this.setState({
30       formValues:{...this.state.formValues,[field]: value},
31     });
32   };
33 
34   onStartChange = value => {
35     this.onChange('strDate', value);
36   };
37 
38   onEndChange = value => {
39     this.onChange('endDate', value);
40   };
41 
42   handleStartOpenChange = open => {
43     if (!open) {
44       this.setState({ endOpen: true });
45     }
46   };
47 
48   handleEndOpenChange = open => {
49     this.setState({ endOpen: open });
50   };
51 
52   render() {
53     const { formValues: { strDate, endDate }, endOpen } = this.state;
54     return (
55       <div>
56         <DatePicker
57           disabledDate={this.disabledStartDate}
58           showTime
59           format="YYYY-MM-DD HH:mm:ss"
60           value={startValue}
61           placeholder="Start"
62           onChange={this.onStartChange}
63           onOpenChange={this.handleStartOpenChange}
64         />
65         <DatePicker
66           disabledDate={this.disabledEndDate}
67           showTime
68           format="YYYY-MM-DD HH:mm:ss"
69           value={endValue}
70           placeholder="End"
71           onChange={this.onEndChange}
72           open={endOpen}
73           onOpenChange={this.handleEndOpenChange}
74         />
75       </div>
76     );
77   }
78 }
79 
80 ReactDOM.render(<DateRange />, mountNode);

 

转载于:https://www.cnblogs.com/TJ-Wong/p/11198925.html