pronts没有在我的AsyncValidationForm方法中打印

时间:2018-12-26 18:42:28

标签: javascript reactjs redux material-ui redux-form

  • 我是redux的新手。
  • 我正在尝试使我的redux表单在我的应用程序中工作。
  • 但是问题是,如果我在文本框中输入任何内容,那么这些值将不会显示在浏览器中。
  • 所以我调试并放置了控制台,我在AsyncValidationForm内部提供的控制台无法打印。 console.log(“ AsyncValidationForm --->”道具);
  • 我没有在开发人员工具中看到任何错误
  • 你能告诉我如何解决它吗?
  • 这样我自己就可以了。
  • 在下面显示我的代码段和沙箱

https://codesandbox.io/s/5kvyxlwqwp

AsyncValidationForm.js

const AsyncValidationForm = props => {
  const { handleSubmit, pristine, reset, submitting } = props;
  console.log("AsyncValidationForm--->", 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>
  );
};

asyncValidate.js

const sleep = ms => new Promise(resolve => setTimeout(resolve, ms));

const asyncValidate = (values /*, dispatch */) => {
  return sleep(1000).then(() => {
    // simulate server latency
    console.log("asyncValidate--->", values);
    if (["john", "paul", "george", "ringo"].includes(values.username)) {
      throw { username: "That username is taken" };
    }
  });
};

export default asyncValidate;

validate.js

const validate = values => {
  const errors = {};
  if (!values.username) {
    errors.username = "Required";
  }
  if (!values.password) {
    errors.password = "Required";
  }
  console.log("validate--->", errors);
  return errors;
};

export default validate;

0 个答案:

没有答案