如何在反应本机日历包中设置滚动周日历的日期

Question

我正在尝试使用来自 react-native-calendars 包的 WeekCalendar。我可以查看周日历并滚动它。但是，我希望在水平滚动时 - 当前日期应该在本周更新为日期，并且应该在 UI 上更新。我该怎么做？

我能够找到onclick的解决方案，但我想滚动当前日期应该是本周的日期。

<WeekCalendar
firstDay={1}
current={selectedDateOfTheWeek}
onDayPress={(day, localDay) => {
changeSelectedDateFromCalendar(day.dateString, false);
}}
hideExtraDays={false}
pastScrollRange={24}
futureScrollRange={24}
markedDates={{
[selectedDateOfTheWeek]: {
selected: true,
selectedColor: "#8660ce"
}
}}
/>

selectedDateOfTheWeek以"YYYY-MM-DD"格式存储日期。我正在使用 Redux 来管理状态。

Answer 1

用

<CalendarProvider
date={this.state.selectedDate.dateString}
onDateChanged={this.onDateChanged}

markedDates={{
...this.state.markedDates,
[this.state.selectedDate.dateString]: {
selected: true,
},
}}
>
<WeekCalendar
testID={testIDs.weekCalendar.CONTAINER}
hideDayNames={true}
firstDay={1}
dayComponent={this.renderDateWeek}
theme={calendarThemes}
calendarWidth={screenWidth}
allowShadow={false}
markedDates={{
...this.state.markedDates,
[this.state.selectedDate.dateString]: {
selected: true,
},
}}
pastScrollRange={(new Date().getFullYear() - 1900) * 12}
futureScrollRange={(2099 - new Date().getFullYear()) * 12}
style={[styles.calendar, { paddingBottom: 20, paddingLeft: 0, paddingRight: 0 }]}
onDayPress={(date) => this.changeDate(date.dateString)}
/>

</CalendarProvider>