How to Disable Future Year, Month and Date in RN?-CodePudding

I know there a lots same questions, but none of them work as I need, about to disable future YYYY-MM-DD in React Native Date Picker:

    <DatePicker
      modal
      open={open}
      date={date}
      mode="date"
      onConfirm={updateFilter}
      maximumDate={new Date()}
      onCancel={() => {
        setOpen(false)
      }}
      
    />

But it not work, the future month and date still displayed. How to disable all future year, month and date?

CodePudding user response：

According to the Readme on the repo for react-native-date-picker, the maximumDate prop requires a string in the form YYYY-MM-DD. Therefore you should instantiate a new Date object and store it in a variable on which you can call the various methods you need to access those portions of the Date. Then you can pass that prop a new Date object, and add the pieces of the string you need, like so:

const currDate = new Date();
<DatePicker>
    ...
    maximumDate={new Date(`${currDate.getFullYear()}-${currDate.getMonth()   1}-${currDate.getDate()}`)}
</DatePicker>

CodePudding user response：

class DatePickerContainer extends React.Component { constructor (props) { super(props) this.state = { startDate: ''

        // Enable this if you want todays date to appear by default
        // startDate: moment()
    };
    this.handleChange = this.handleChange.bind(this);
}

handleChange(date) {
    this.setState({
        startDate: date
    });
}

render() {
    return <DatePicker
        selected={this.state.startDate}
        onChange={this.handleChange}
        placeholderText="MM/DD/YYYY"
    />;
}

}