Удаление объектов из массива onPress в React Native - PullRequest
0 голосов
/ 06 февраля 2019

Моя задача - получить максимум пять дат от пользователя, нажав на каждую дату в календаре.Например, пользователь может щелкнуть 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.Но, если пользователь репрессирует в одну и ту же выбранную дату, выбранная дата должна быть не выбрана, а также она должна обновляться в состоянии (как перерисовка календаря при изменении состояния).

Как я могу это сделать?Пожалуйста, ведите меня!

1 Ответ

0 голосов
/ 06 февраля 2019

Вы можете проверить, включает ли selectedDateByOnPress уже day.Если да, то filter.Иначе, добавьте его в массив:

this.setState((prevState) => ({
      selectedDateByOnPress: 
          [...(prevState.selectedDateByOnPress.some(d => d.dateString === day.dateString) 
                 ? prevState.selectedDateByOnPress.filter(d => d.dateString !== day.dateString) 
                 : [...prevState.selectedDateByOnPress, day])
          ],
      daysing: day
    }))
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...