1.0.1 • Published 4 years ago
school-calendar-react v1.0.1
school-calendar-react
A pretty calender for react
This is the React version of the calendar component in SHUHelper
How to use
Just run
yarn add school-calendar-react
or
npm install school-calendar-react
in your React project.
And you can use the Calendar
component in your code:
let [date, setDate] = useState(new Date());
<Calendar date={date} // the date you want to be displayed
events={getEvents} // (date: Date) => Array<Dot> | string, if the return value is a string, it'll be displayed below the date
// `Dot` is interface { color: string }, it'll be displayed as a dot below the date
onSelect={setDate} // (date: Date) => void, callback when a date is selected,
style={{borderRadius: 4}}
className: {"theme--light"} // classNames, for themes, "theme--light" is the default value, can also use "theme--dark"
// if "theme--light" or "theme--dark" class is set in the parent or ancestor component, it will also take effect
/>
Demo
Clone this repo and run
yarn && yarn dev
for a demo.