Redux-form在OnSubmit处理程序中返回Proxy

Question

我尝试运行示例代码.

<form onSubmit={values => console.log("========>", values)}>
    <div>
      <label htmlFor="firstName">First Nameeee</label>
      <Field name="firstName" component="Input" type="text"/>
    </div>
    <div>
      <label htmlFor="lastName">Last Name</label>
      <Field name="lastName" component="Input" type="text"/>
    </div>
    <div>
      <label htmlFor="email">Email</label>
      <Field name="email" component="Input" type="email"/>
    </div>
    <button type="submit">Submit</button>
  </form>

但是当我处理onSubmit事件时,param值返回一个Proxy而不是一个带有输入值的对象.

//Console.log output
Proxy {dispatchConfig: Object, _targetInst: ReactDOMComponent, _dispatchInstances: ReactDOMComponent, nativeEvent: Event, type: "submit"…}

Answer 1

你应该将它包装成handleSubmit函数(它由redux-form提供),如下所示:

render() {
    return (
        <form onSubmit={this.props.handleSubmit(values => console.log("========>", values))}>
          <div>
            <label htmlFor="firstName">First Nameeee</label>
            <Field name="firstName" component="Input" type="text"/>
          </div>
          <div>
            <label htmlFor="lastName">Last Name</label>
            <Field name="lastName" component="Input" type="text"/>
          </div>
          <div>
            <label htmlFor="email">Email</label>
            <Field name="email" component="Input" type="email"/>
          </div>
        <button type="submit">Submit</button>
      </form>
    );
}