Как получить доступ к данным формы в пользовательских компонентах вact-admin? - PullRequest
2 голосов
/ 04 февраля 2020

Мне нужно изменить поведение кнопки панели инструментов в зависимости от поля состояния формы. Я не знаю, как получить доступ к текущим данным формы для чтения значения состояния.

Я попытался использовать 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

1 Ответ

1 голос
/ 04 февраля 2020

Доступ к значениям поля текущей формы можно получить следующим образом:

import { useForm } from 'react-final-form';

const form = useForm();
var formdata = form.getState().values;

formdata содержит все значения формы в виде объекта.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...