无法从异步提交验证中的道具获取错误值

Posted 2023-02-22

【中文标题】无法从异步提交验证中的道具获取错误值

【英文标题】：Not able to get error value from props in Async submit validation

【发布时间】：2018-04-25 10:26:04

【问题描述】：

我在 react-redux 应用中的提交操作如下

export function submitDetails(details, callback) 
return(resolve, reject) =>
        axios.post(URL, 
        "email": details['email'],
        "name": details['username'],
        "password": details['password']
    ).then((data) =>
            callback();
            console.log("Success", data);
            resolve(data);
    ).catch((error) => 
        // console.log('error here', error.response.data.message);
        console.log('error', error.response);
        reject(error.response)
    )

如果电子邮件已经注册，控制台会在这种情况下成功打印错误。但是，当我尝试在用户表单上打印相同的错误时，如下所示

<form onSubmit=handleSubmit(this.onFormSubmit.bind(this))>
                        <Field
                            name="username"
                            lable="Username"
                            type="text"
                            component= renderField 
                        />
                        <Field
                            name="email"
                            type="email"
                            lable="Email"
                            component= renderField 
                        />
                        console.log("cheki...",error)
                        hahahaaherror
                        error  && <strong>error</strong>
                        <Field
                            name="password"
                            type="password"
                            lable="Password"
                            component= renderField 
                        />
                        <Field
                            name="confirm_password"
                            type="password"
                            lable="Confirm Password"
                            component= renderField 
                        />
                        <button type="submit" className="btn btn-primary" disabled=submitting>Register</button>
                        <Link className="btn btn-danger" to="/login">Cancel</Link>

                    </form>

永远不会打印错误。 即const error, submitting, handleSubmit = this.props; 错误变量始终为空。是不是我做错了什么？？？

【问题讨论】：

error 永远不会作为道具传递？

是的，我无法访问它

问题是你在哪里把它作为道具传递。

【参考方案1】：

首先，如果你只想验证onSubmit，你应该改用Submit Validation。

如果您真正想要的是异步验证，我可以在您的代码中看到两个错误。

您没有抛出错误；

捕捉（（错误）=> console.log('error', error.response); // 你应该在这里抛出一个错误，例如： // throw username: '该用户名已被占用' 拒绝（错误。响应） )

你把error弄错了。你应该这样做：

常量 元：异步验证，触摸，错误， 提交， 处理提交 = this.props;

从redux-form 文档中参考this great example。