我是歌谣 微信公众号关注前端小歌谣
import * as React from 'react';
import {Button,Typography,Box} from '@mui/material';
import { Create,useNotify,Toolbar,SaveButton, SimpleForm, TextInput, DateInput, required,TopToolbar} from 'react-admin';
import { useFormContext } from 'react-hook-form';
const PostCreateActions = () => (
<TopToolbar>
{/* Add your custom actions */}
<Button color="primary">geyao</Button>
</TopToolbar>
);
const Aside = () => (
<Box sx={{ width: '200px', margin: '1em' }}>
<Typography variant="h6">Instructions</Typography>
<Typography variant="body2">
Posts will only be published once an editor approves them
</Typography>
</Box>
);
export const RcreateAdd = () => {
const notify = useNotify();
const onSuccess = (data) => {
notify(`Changes saved`);
};
const transform = data => ({
...data,
name: `${data.name} ${data.sex}`
});
const PostCreateToolbar = () => {
const notify = useNotify();
const { reset } = useFormContext();
return (
<Toolbar>
<SaveButton
type="button"
label="post.action.save_and_add"
variant="text"
mutationOptions={{
onSuccess: () => {
reset();
window.scrollTo(0, 0);
notify('ra.notification.created', {
type: 'info',
messageArgs: { smart_count: 1 },
});
},
}}
/>
</Toolbar>
);
};
return(
<Create toolbar={<PostCreateToolbar />} mutationOptions={{ meta: { geyao: 'geyao' } }}
transform={transform} disableAuthentication component="div" actions={<PostCreateActions />} aside={<Aside />}>
<SimpleForm>
<TextInput source="name" validate={[required()]} fullWidth />
<TextInput source="sex" multiline={true} label="Short description" />
<TextInput source="salary" multiline={true} label="Short description" />
</SimpleForm>
</Create>
)
}运行结果
