Мне нужно изменить поведение кнопки панели инструментов в зависимости от поля состояния формы. Я не знаю, как получить доступ к текущим данным формы для чтения значения состояния.
Я попытался использовать FormDataConsumer
в окружающем компоненте (Toolbar
в моем случае) и передать formData в качестве подпорки. , но это имело побочный эффект, что handleSubmitWithRedirect
внутри кнопки не работал.
Я бы хотел прочитать данные формы непосредственно внутри компонента кнопки. Как я могу это сделать?
Текущий код:
// ------------------------------------------------------------------------------------------
const StatusButton= ({ handleSubmitWithRedirect, ...props }) => {
const form = useForm();
const handleClick = useCallback(() => {
switch (props.formdata.status.id) {
case 0:
form.change('status', status[1]);
break;
case 1:
form.change('status', status[2]);
break;
default:
}
handleSubmitWithRedirect('list');
}, [form]);
return <SaveButton {...props} handleSubmitWithRedirect={handleClick} />;
};
// ------------------------------------------------------------------------------------------
export const MyToolbar= props => (
<Toolbar {...props} >
<SaveButton
label="Speichern"
redirect="list"
submitOnEnter={true}
variant="text"
/>
<FormDataConsumer>
{({ formData, ...rest }) =>
<StatusButton
label="Statuswechsel"
redirect="list"
submitOnEnter={false}
variant="text"
formdata={formData}
/>
}
</FormDataConsumer>
</Toolbar>
);
Обновление: вы можете увидеть пример в codeandbox:
https://codesandbox.io/s/react-admin-accessformdata-v0uq7?fontsize=14&hidenavigation=1&initialpath=%23%2Fposts%2F1%2Fshow&module=%2Fsrc%2Fposts%2FPostShow.js&theme=dark