reactjs - React antd 表单禁用提交按钮

Question

如何使用 antd 禁用表单提交按钮
表单验证有效，但我需要在验证失败时在视觉上禁用表单提交按钮

这是一个stackblitz url
https://stackblitz.com/edit/react-ts-z5d6tr?file=Hello.tsx

Answer 1

我找到了一些优雅的方式来执行此操作

<Form.Item shouldUpdate className="submit">
  {() => (
    <Button
      type="primary"
      htmlType="submit"
      disabled={
        !form.isFieldsTouched(true) ||
        form.getFieldsError().filter(({ errors }) => errors.length)
          .length > 0
      }
    >
      Log in
    </Button>
  )}
</Form.Item>