authProviderauthProviderauthProviderauthProviderauthProvider<Refine>onFinishonFinishonFinishuseFormuseFormuseFormuseFormuseFormonFinishHandleronFinishHandleronClickonClickonClickonClickonClickonClickonClickhandleSubmithandleSubmitsaveButtonPropssaveButtonPropssaveButtonPropssaveButtonPropshandleClickhandleClickmodifiedValuescreatecreatecreatecreatesimpleRestProvidersimpleRestProvider.createControllerControllerControllerdefaultValuedefaultValuemyStatesetValuereact-hook-formimport { Refine } from "@refinedev/core";
import authProvider from "./authProvider";
function App() {
return (
<Refine
authProvider={authProvider}
//...
/>
);
}
export default App; export default function TTCreate() {
const translate = useTranslate();
const {
saveButtonProps,
refineCore: { formLoading },
register,
control,
formState: { errors },
handleSubmit,
onFinish,
} = useForm();
const onFinishHandler = (data) => {
onFinish({
...data,
edges: {
base: data.base,
},
});
};
return (
<Create
isLoading={formLoading}
saveButtonProps={{
...saveButtonProps,
onClick: handleSubmit(onFinishHandler),
}}
>
{/* Rest of your component */}
</Create>
);
}export default function TTCreate() {
const translate = useTranslate();
const {
saveButtonProps,
refineCore: { formLoading },
register,
control,
formState: { errors },
handleSubmit,
} = useForm();
const handleClick = (values) => {
const modifiedValues = {
...values,
edges: {
base: values.base,
},
};
saveButtonProps.onClick(modifiedValues);
};
return (
<Create
isLoading={formLoading}
saveButtonProps={{
...saveButtonProps,
onClick: handleSubmit(handleClick),
}}
>
{/* Rest of your component */}
</Create>
);
}const dataProvider = {
...simpleRestProvider,
create: async ({ resource, variables }) => {
const modifiedVariables = {
...variables,
edges: {
base: variables.base,
},
};
return simpleRestProvider.create({ resource, variables: modifiedVariables });
},
};
<Refine dataProvider={dataProvider}>{/* ... */}</Refine>;const [myState, setMyState] = useState("initial value");
<Controller
name="myField"
control={control}
defaultValue={myState}
render={({ field }) => (
<Select {...field}>
{/* Your options */}
</Select>
)}
/>