I want to use '@devexpress/dx-react-scheduler' library.
But it cause Typescript error like under.
Type '{ children: Element[]; data: AppointmentModel[]; }' is not assignable to type 'IntrinsicAttributes & SchedulerProps'. Property 'children' does not exist on type 'IntrinsicAttributes & SchedulerProps'.
I made it the same as in the official documentation ( https://devexpress.github.io/devextreme-reactive/react/scheduler/docs/guides/typescript/ ), but the following error also occurs in the official documentation.
The difference is, the official documentation only shows a warning ( https://codesandbox.io/s/fcj6pm ),
import * as React from 'react';
import Paper from '@mui/material/Paper';
import { AppointmentModel, ViewState, SchedulerDateTime } from '@devexpress/dx-react-scheduler';
import {
Scheduler, DayView, Appointments, Resources,
} from '@devexpress/dx-react-scheduler-material-ui';
const Demo = () => {
const [currentDate, setCurrentDate] = React.useState<SchedulerDateTime>('2018-10-31');
return (
<Paper>
<Scheduler
data={appointments}
>
<ViewState
currentDate={currentDate}
onCurrentDateChange={setCurrentDate}
/>
<DayView
startDayHour={7}
endDayHour={12}
/>
<Appointments />
<Resources
data={resources}
/>
</Scheduler>
</Paper>
);
};
export default Demo;
but I get an error(not just a warning) and the screen doesn't appear.
What should I do..?
Sorry for my late answer. It seems you have to use the component from "@devexpress/dx-react-scheduler". And then set the requiered props.
like this: (sudo code). rootComponent returns the from "@devexpress/dx-react-scheduler-material-ui"
import { Scheduler as MuiSchedular, DayView, Appointments, Resources, } from "@devexpress/dx-react-scheduler-material-ui"; import { AppointmentModel, Scheduler, ViewState, } from "@devexpress/dx-react-scheduler"; export const Calendar = () => { const rootComponent = (props: Scheduler.RootProps) => { return <MuiSchedular.Root {...props} /> }; return ( <Paper> <Scheduler height={"auto"} firstDayOfWeek={1} rootComponent={rootComponent} data={appointments?? []} locale={"da-DK"} > <ViewState currentDate={currentDate} onCurrentDateChange={setCurrentDate} /> <DayView startDayHour={7} endDayHour={12} /> <Appointments /> <Resources data={resources} /> </Scheduler> </Paper> ); }
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.