Как читать данные формы по запросу? - PullRequest
Новая
       44

Как читать данные формы по запросу?

0 голосов
/ 12 января 2019

У меня есть мастер форм, который мне пришлось разделить на формы с разными именами, потому что в противном случае у нас были проблемы с асинхронной проверкой с помощью sagas.
После отправки последней формы я хотел бы прочитать / объединить значения из всех форм (которые динамически именуются в зависимости от типа регистрации), шаблон именования - «customerRegistrationStep» / «businessRegistrationStep» + [номер шага]
Прямо сейчас мое уродливое решение состоит в том, чтобы иметь обработчик отправки в родительском компоненте, который связан со всем состоянием и запускает селектор getFormValues ​​в избыточной форме при запуске.
Я хотел бы иметь возможность читать значения более понятным способом и не иметь полного состояния в качестве проп.
Вот подключенный компонент с обработчиком отправки: 

export class RegistrationForm extends React.Component<Props> {
    handleSubmit = () => {
        console.log(
            getRegistrationFormsValues(this.props.registrationType, this.props.state),
        );
    };
    shouldComponentUpdate(nextProps: Props) {
        return nextProps.registrationType !== this.props.registrationType;
    }
    render(): React.Node {
        return (
            <Wizard
                onSubmit={this.handleSubmit}
                registrationType={this.props.registrationType}
            />
        );
    }
}

const mapStateToProps = state => ({
    state: state,
});

export default connect(mapStateToProps)(RegistrationForm);

и вот вспомогательная функция, которая запускает селектор: 

const getRegistrationFormsValues = (
    registrationType: RegistrationType,
    state: any,
): Array<any> => {
    const formNames = getRegistrationFormsNames(registrationType);
    return formNames.map(formName => {
        return { [formName]: getFormValues(formName)(state) };
    });
};
...