Question

我试图将redux表单包含在步进器中。
所以我遵循了本教程，并使用了异步形式https://redux-form.com/8.0.4/docs/gettingstarted.md/
在演示中可以正常工作。
但是当我按下注册按钮时，我遇到了一个错误的handleSubmit（），onSubmit函数或将onSubmit传递为道具。
所以我通过放置控制台调试了所有文件。
点击“提交”时，我的所有控制台均未打印。
由于handleSubmit会有问题。
您能告诉我如何修复它，以便将来我自己修复。
在下面提供我的沙盒和代码段。 https://codesandbox.io/s/98qjwrrklr

const AsyncValidationForm = props => {
  console.log("AsyncValidationForm ---->");

  const { handleSubmit, pristine, reset, submitting } = props;
  return (
    <form onSubmit={handleSubmit}>
      <Field
        name="username"
        type="text"
        component={renderField}
        label="Username"
      />
      <Field
        name="password"
        type="password"
        component={renderField}
        label="Password"
      />
      <div>
        <button type="submit" disabled={submitting}>
          Sign Up
        </button>
        <button type="button" disabled={pristine || submitting} onClick={reset}>
          Clear Values
        </button>
      </div>
    </form>
  );
};

Answer 1

1）

您必须将onSubmit参数传递给具有de reduxForm HOC的组件：

  <AsyncValidationForm onSubmit={values => { console.log(values) }} />

2）您没有正确创建商店，因为商店需要像示例一样的表单字段：

import { reducer as reduxFormReducer } from 'redux-form';
const reducer = combineReducers({
  form: reduxFormReducer, // mounted under "form"
});

但是您要定义商店如下：

const reducer = () => ({});
const store = createStore(reducer);

您可以简单地从index.js中的store.js文件导入商店：

import store from './store';

handleSubmit（）一个onSubmit函数或将onSubmit作为prop传递

1 个答案: