Hi I need to update the multi-dot on the calendar on monthly changes
It seems like it's only working on debug mode. The document says the marked date object is immutable. How do I refresh the calendar on new markedDates object
const [calenderDots, setCalenderDots] = useState({});
const pins = [
{ key: 'medication', color: 'green' },
{ key: 'doctorNote', color: 'red' },
];
const formatDots = (data) => {
return data.reduce((initial, current) => {
return Object.assign(initialValue, { [data?.date]: { dots: pins } });
});
};
const fetchMonthlyData = async (date) => {
const response = await fetchData(date);
setCalenderDots(formatDots(response));
};
return <Calendar onMonthChange={fetchMonthlyData} markedDates={calenderDots} />;
Any idea on this issue. I could not find any better solution. Please help
I'm facing exactly this issue
Since marked dates not working for me. I have used render day props to implement dots under each day
return <Calendar
onMonthChange={fetchMonthlyData}
//markedDates={calenderDots}
dayComponent={({date})=><CustomDotsComponent date={date} />}
/>;
//dots <Text>•</Text>