Как мне проверить все поля reduxForm в цикле?

#javascript #reactjs #redux-form

#javascript #reactjs #redux-форма

Вопрос:

У меня есть форма авторизации, в которой Field существует 2 s, и ее довольно легко проверить. Вот как я это делаю:

 const reducers = {
    // ... your other reducers here ...
    form: formReducer
}
const reducer = combineReducers(reducers)
const store = createStore(reducer)





class Authorization extends Component {
    constructor() {
        super();
    }

    render() {
        return (
        <Provider store={store}>
              <AuthForm/>
         </Provider>
        )
    }
}



AuthForm extends Component {
    validate_login = values => {
        console.log("Validating login... Login is", values)
    }
    validate_pwd = values => {
        console.log("Validating password... Passwd is", values)
    }
    render() {
        const { handleSubmit } = this.props
        return (
            <form onSubmit={handleSubmit} className="authorization-center-wrapper">
                <div className="authorization-column-wrapper">
                    <label className="authorization-RTA-text" onClick={this.home_page}>RTA</label>
                    <label className="authorization-auto-text">AUTH</label>
                    <div className="authorization-center-content">
                        <Field validate={[this.validate_login]} name={"login"} component={'input'} type="text" placeholder="Email" className="authorization-login-input"/>

                        <Field validate={[this.validate_pwd]} name={"password"} component={'input'} type="password" placeholder="Password" className="authorization-password-input"/>

                        <button className="authorization-come-in-btn" type={"submit"}>Log in</button>
                        <p className="authorization-forgot-password" onClick={this.forgot_pass}>Forgot password?</p>
                        <Link to={"/reg"} className="authorization-reg-btn" onClick={this.reg_page}>Sign up</Link>
                    </div>
                </div>
            </form>
        )
    }


}


AuthForm = reduxForm({
    // a unique name for the form
    form: 'authorization'
})(AuthForm)



ReactDOM.render(<Authorization/>, document.getElementById("root")); 
 <script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>

<div id="root"></div> 

Теперь он работает нормально, но у меня есть регистрационная форма, где у меня есть 10 полей. Существует ли какой-либо цикл или sth для проверки значений на предмет того, что они не пустые? (Желательно без атрибутов validate), я не могу найти какое-либо решение в Интернете.

Не удается создать воспроизводимый код, потому что не знаю, как это сделать в stackoverflow с помощью react

Заранее благодарю

Комментарии:

1. ilushahot Добро пожаловать в SO. Если вы хотите привести воспроизводимые примеры для react, вы можете попробовать использовать codesandbox.io в будущем. И добавьте ссылку в свой пост

2. @arjithn хорошо, я запомню