我正在使用 React-big-calendar 库来制作日历。一切都很好。我希望在当天的时段应该有一个标签或文本“+create-event”,它将重定向到“/create-event-page/create-event”。 但我无法确定可以使用哪个道具或自定义道具来添加这个东西:
**CODE:**
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 the calendar styles
const localizer = momentLocalizer(moment);
const myEventsList = [
{
start: moment("2023-09-23T10:00:00").toDate(),
end: moment("2023-09-23T13:00:00").toDate(),
title: "Concert",
},
{
start: moment("2023-09-26T10:00:00").toDate(),
end: moment("2023-09-28T13:00:00").toDate(),
title: "Music Workshop",
},
{
start: moment("2023-09-24T10:00:00").toDate(),
end: moment("2023-09-24T13:00:00").toDate(),
title: "Conference",
},
];
export default function OrganizerEventCalendar() {
const handleSelect = () => {
console.log("Hello World");
};
return (
<div>
<Calendar
localizer={localizer}
events={myEventsList}
selectable={true}
onSelectSlot={handleSelect}
startAccessor="start"
endAccessor="end"
style={{ height: 500 }}
views={["month", "week"]}
formats={{ weekdayFormat: "dddd" }}
className="table-drop-shadow rounded-lg bg-[#F3FAFF] p-3"
/>
</div>
);
}
The thing i wants is look like this:
Please refer to the image as it contains create event label on the date-slot. How can I implement this:
我想知道这个库的哪个道具可以用来实现这个功能或者我如何自定义实现这个功能?
听起来您正在寻找需要传递给“插槽/事件”的“自定义组件”,您可能想研究一下。