当字段无效时，如何在Antd表单外禁用提交按钮？

import { Form, Button } from 'antd';
const FormItem = Form.Item;

class MyForm extends React.Component {
  // 定义字段及校验规则
  handleSubmit = e => {
    e.preventDefault();
    this.props.form.validateFields((err, values) => {
      if (!err) {
        console.log('提交的表单值: ', values);
      }
    });
  };

  render() {
    const { getFieldDecorator, getFieldsError } = this.props.form;

    // 设置字段校验规则
    getFieldDecorator('field1', {
      rules: [{ required: true, message: '字段1不能为空' }],
    });
    getFieldDecorator('field2', {
      rules: [{ required: true, message: '字段2不能为空' }],
    });

    const isFieldsValid = Object.values(getFieldsError()).every(errors => errors === undefined);
    // 判断是否所有字段都有效

    return (
      <Form onSubmit={this.handleSubmit}>
        <FormItem>
          {getFieldDecorator('field1')(<Input placeholder="字段1" />)}
        </FormItem>
        <FormItem>
          {getFieldDecorator('field2')(<Input placeholder="字段2" />)}
        </FormItem>
        <Button type="primary" htmlType="submit" disabled={!isFieldsValid}>
          提交
        </Button>
      </Form>
    );
  }
}

// 使用Form.create创建表单实例
const WrappedMyForm = Form.create()(MyForm);

class ParentComponent extends React.Component {
  render() {
    return <WrappedMyForm />;
  }
}