Я хочу изменить цвет фона для конкретной даты, на которую я нажал дату в большом календаре реакции
когда пользователь щелкнул определенную дату, цвет фона должен быть изменен, есть ли идеи, как это сделать. Я уже пробовал много способов, но я не могу установить цвет фона на выбранную дату, пожалуйста, помогите мне, если у вас есть какие-либо представления об этом
или же
любую бесплатную библиотеку, пожалуйста, предложите
import React from 'react';
import { Calendar, momentLocalizer } from 'react-big-calendar'
import moment from 'moment';
import 'react-big-calendar/lib/css/react-big-calendar.css';
import './calendarCustomization.scss';
const localizer = momentLocalizer( moment );
const CalendarView = props => {
const myEventsList = []
const customDayPropGetter = date => {
if (date.getDate() === 7 || date.getDate() === 15)
return {
className: 'special-day',
style: {
border: 'solid 3px ' + (date.getDate() === 7 ? '#faa' : '#afa'),
},
}
else return {}
}
const selectedDate = (slotInfo) => {
alert(
`selected slot: \n\nstart ${slotInfo.start.toLocaleString()} ` +
`\nend: ${slotInfo.end.toLocaleString()}` +
`\naction: ${slotInfo.action}`
)
}
return <div><Calendar
selectable={true}
className='customCalendar'
localizer={ localizer }
events={ myEventsList }
onSelectSlot={selectedDate }
onNavigate={ (date,view) =>console.log('Date',date,'view',view) }
/></div>
}
export default CalendarView;
1 ответ
Мне очень понравился React Datepicker - https://reactdatepicker.com/ .
Другой альтернативой является компонент из библиотеки AntD - https://ant.design/components/time-picker/ .
Вы также можете найти множество из них на github. Один пример - https://github.com/wojtekmaj/react-calendar