如何获取tabs里的form值？

Question

在最后Form校验时获取不到tabs里form的错误

const TabPanesForm =  Form.create()(props => {
  const { form: { getFieldDecorator } } = props; 
  return (
    <Card title="任务管理" className={styles.card} bordered={false}>
      <Form layout="inline" >
        <Row gutter={{ md: 8, lg: 24, xl: 48 }}>
          <Col md={8} sm={24}>
            <Form.Item label='123' >
            {getFieldDecorator('name' , {
                  rules: [{
                    required: true,
                    message: `发货编号不能为空.`,
                  }]
                })(<Input placeholder="请输入" />)}
            </Form.Item>
          </Col>
          <Col md={8} sm={24}>
            <Form.Item label="状态">
              {getFieldDecorator('numberChange')(<Input placeholder="请输入" />)}
            </Form.Item>
          </Col>
          <Col md={8} sm={24}>
            <Form.Item label="单号时间">
              {getFieldDecorator('numberChange')(<Input placeholder="请输入" />)}
            </Form.Item>
          </Col>
        </Row>
        <Row gutter={{ md: 8, lg: 24, xl: 48 }}>
          <Col md={8} sm={24}>
            <Form.Item label='123' >
              {getFieldDecorator('numberChange')(<Input placeholder="请输入" />)}
            </Form.Item>
          </Col>
          <Col md={8} sm={24}>
            <Form.Item label="状态">
              {getFieldDecorator('numberChange')(<Input placeholder="请输入" />)}
            </Form.Item>
          </Col>
          <Col md={8} sm={24}>
            <Form.Item label="单号时间">
              {getFieldDecorator('numberChange')(<Input placeholder="请输入" />)}
            </Form.Item>
          </Col>
        </Row>
        <Row gutter={{ md: 8, lg: 24, xl: 48 }}>
          <Col md={8} sm={24}>
            <Form.Item label='123' >
              {getFieldDecorator('numberChange')(<Input placeholder="请输入" />)}
            </Form.Item>
          </Col>
          <Col md={8} sm={24}>
            <Form.Item label="状态">
              {getFieldDecorator('numberChange')(<Input placeholder="请输入" />)}
            </Form.Item>
          </Col>
          <Col md={8} sm={24}>
            <Form.Item label="单号时间">
              {getFieldDecorator('numberChange')(<Input placeholder="请输入" />)}
            </Form.Item>
          </Col>
        </Row>
        <Row>
          <Col>
            <Form.Item label="派送仓库">
              {getFieldDecorator('numberChange')(<Input placeholder="请输入" />)}
            </Form.Item>
          </Col>
        </Row>
        <Row> {/*  // 派送仓库 */}
          <Col>
            <Form.Item label="海外仓编号">
              {getFieldDecorator('numberChange')(<Input placeholder="请输入" />)}
            </Form.Item>
          </Col>
          <Col>
            <Form.Item label="海外仓ID">
              {getFieldDecorator('numberChange')(<Input placeholder="请输入" />)}
            </Form.Item>
          </Col>
        </Row>
        <Row>
          <Col>
            <Form.Item label="备注">
              {getFieldDecorator('numberChange')(<Input placeholder="请输入" />)}
            </Form.Item>
          </Col>
        </Row>
      </Form>
    </Card>
  );
}) 
const panes = [
  { title: '分单地址1', content: <TabPanesForm wrappedComponentRef={(form) => this.formRef = form} />, key: '1' ,closable: false},
];

Tabs 里的Form 在OrderDetails 外

@Form.create()
class OrderDetails extends PureComponent {
 <Card >
    <Form > // 第一个
    </Form>
 </Card>
 <Tabs defaultActiveKey="1"
          type="editable-card"
          hideAdd={false}
          onChange={this.onChange}
          onEdit={this.onEditTabs}
          className={styles.tabslist}
        >
          {this.state.panes.map(pane => <TabPane tab={pane.title} key={pane.key}  closable= 
  {pane.closable}>{pane.content}</TabPane>)} 
 </Tabs>
}

在使用 validateFieldsAndScroll 校验的时候 只有有第一个form的值，获取不到Tabs里的form

 validate = () => {
    const {
      form: { validateFieldsAndScroll },
      dispatch,
    } = this.props;
    debugger
    validateFieldsAndScroll((error, values) => {
      debugger
      if (!error) {
        // submit the values
        dispatch({
          type: 'order_details/submitAdvancedForm',
          payload: values,
        });
      }
    });
  };

大概的错误应该是在form上， 但是不知道怎么改。

Answer 1

你创建了两个Form域，你应该 给 TabPanesForm 组件传递 OrderDetails组件的 form