Issue
This Content is from Stack Overflow. Question asked by TheMilkMan
I am using the Calendar Object from react-native-calendars
and one of the props for its supplied <Calendar>
component is markedDates
It is supposed to have a format like the following…
"2022-09-12": {"activeOpacity": 0.5, "color": "white", "dots": [[Object]], "marked": true, "selected": false},
"2022-09-14": {"activeOpacity": 0.5, "color": "white", "dots": [[Object]], "marked": true, "selected": false},
"2022-09-16": {"activeOpacity": 0.5, "color": "white", "dots": [[Object]], "marked": true, "selected": false},
"2022-9-17": {"selected": true},
"2022-9-19": {"selected": false},
wherein selected
if true, activates the selectedStyle
on the date, and where dots
is an array of dot
objects that indicate the presence of dots beneath the date value.
The issue is, notice how ‘2022-9-17’ is set to {selected: true} yet the Calendar does not reflect that. I am console.log
-ing the value displayed above in a useEffect, but it does not reflect what is shown in the Calendar. Does anyone aware of Calendar
know if there’s a way to get around this, or if I’m doing something improperly? The Calendar
is called like so…
return(
<View style={{height: maxHeight * 0.43}}>
<CalendarProvider date={selectedDay} onDateChanged={() => handleSetSelectedDay(selectedDay)}>
<Calendar
markingType={`multi-dot`}
markedDates={markedDateObjects}
hideExtraDays={true}
onDayPress={day => { handleDateClick(day) }}
// Other stuff irrelevant for the issue
/>
</CalendarProvider>
</View>
)
Solution
This question is not yet answered, be the first one who answer using the comment. Later the confirmed answer will be published as the solution.
This Question and Answer are collected from stackoverflow and tested by JTuto community, is licensed under the terms of CC BY-SA 2.5. - CC BY-SA 3.0. - CC BY-SA 4.0.