当用户输入超过一个或一个字符时，如何显示错误？

Question

我正在为我的申请使用ant design。 https://ant.design/components/table/ 我面临一个验证问题。我在演示中实现了表格。当我点击edit按钮时，它向我显示input field

我能够添加required的验证。因此不允许为空。但是我希望用户仅在one字段内输入input或1个字符，否则显示错误。

这是我的代码 https://codesandbox.io/s/thirsty-tesla-1nwph

return (
      <td {...restProps}>
        {editing ? (
          <Form.Item style={{ margin: 0 }}>
            {getFieldDecorator(dataIndex, {
              rules: [
                {
                  required: true,
                  message: `Please Input ${title}!`
                }
              ],
              initialValue: record[dataIndex]
            })(getInput())}
          </Form.Item>
        ) : (
          children
        )}
      </td>
    );
  };

表格错误 https://ant.design/components/form/

Answer 1

  

我能够添加对必填项的验证。因此不允许为空。但我希望用户仅在输入字段中输入一个或1个字符，否则显示错误。

如果您说“输入中仅文字1或one应该有效”，则可以使用

              rules: [
                {
                  required: true,
                  message: `Please Input ${title}!`
                },
                {
                  pattern: /^(1|one)$/,
                  message: "Only 1 or one are valid"
                }
              ],

否则，如果它是长度，则可以使用max属性。可以在此处查看所有验证规则的列表：https://ant.design/components/form/?locale=en-US#Validation-Rules