Моя задача - получить максимум пять дат от пользователя, нажав на каждую дату в календаре.Например, пользователь может щелкнуть 5 дат в календаре, а также, если пользователь нажимает на выбранную дату, выбор следует удалить, чтобы пользователь мог снова щелкнуть одну дату.
Я использую реагирование.native-календари, чтобы показать календарь, и достиг процесса выбора даты путем сохранения даты в состоянии.Но, не могу понять, как удалить выбранную дату из состояния, если пользователь подавляет выбранную дату.
Вот мой код:
class PausePlan extends Component {
onPressSelectionHandler(day) {
this.setState((prevState) => ({selectedDateByOnPress: [...prevState.selectedDateByOnPress, day ], daysing: day}));
}
state={selectedDateByOnPress: [], selected: false, daysing: ""}
render () {
const selectedDate = _.uniqBy(this.state.selectedDateByOnPress, function(e){
return e;
});
const date = format(new Date(), 'YYYY-MM-DD');
const addingDate = format(addDays(new Date(date), 30), 'YYYY-MM-DD');
return (
<Container>
<View style={{ paddingTop: 10, paddingLeft: 60 }}>
<H1>Plan Status</H1>
</View>
<View style={{ paddingTop: 20 }}>
<Calendar
minDate={date}
maxDate={addingDate}
onDayPress={(day) => {
this.onPressSelectionHandler(day)
}}
markedDates={selectedDate.reduce((acc, {dateString}) => {
acc[dateString] = { selected: dateString === this.state.daysing ? true : false, color: '#22a6b3'};
return acc;
},
{}
)}
markingType={'period'}
/>
</View>
</Container>
);
}
};
Используя вышеуказанный код,если пользователь нажимает на дату, она выбирается, и я устанавливаю это в моем состоянии, используя обработчик onpress.Но, если пользователь репрессирует в одну и ту же выбранную дату, выбранная дата должна быть не выбрана, а также она должна обновляться в состоянии (как перерисовка календаря при изменении состояния).
Как я могу это сделать?Пожалуйста, ведите меня!