reactjs - 我想使用对 Ant 设计的 react 来验证密码

我想使用带有响应的 Ant 设计来验证密码。但是， Ant 设计没有任何验证，我该怎么做？请帮我。

 const LoginForm = Form.create()(props => {
  const { getFieldDecorator } = props.form;
  return (
    <Form onSubmit={props.onSubmit} className="form-size form-margin">
      <FormItem>
        {getFieldDecorator("email", {
          rules: [
            {
              type: "email",
              message: "The input is not valid E-mail!"
            },
            { required: true, message: "Please input your username!" }
          ]
        })(<Input placeholder="Email" />)}
      </FormItem>
      <FormItem>
        {getFieldDecorator("password", {
          rules: [{ required: true, message: "Please input your Password!" }]
        })(<Input type="password" placeholder="Password" />)}
      </FormItem>
      <FormItem>
        <Button type="primary" htmlType="submit" className="login-form-button">
          Log in
        </Button>
      </FormItem>
      <span style={{ color: "red" }}>
        {props.loginStatus ? "" : props.loginMessage}
      </span>
    </Form>
  );
});

最佳答案

使用validator规则:

  const validatePassword = (rule, value, callback) => {
    if (value && value !== "Secret") {
      callback("Error!");
    } else {
      callback();
    }
  };

  <FormItem>
    {getFieldDecorator("password", {
      rules: [
        { required: true, message: "Please input your Password!" },
        { validator: validatePassword }
      ]
    })(
      <Input
        type="password"
        placeholder="Password"
      />
    )}
  </FormItem>

关于reactjs - 我想使用对 Ant 设计的 react 来验证密码，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/51203041/