Why did the form submission of andesign report an error with validateFields?

error content:
ypeError: Cannot read property "push" of undefined

at createBaseForm.js:359
at Array.forEach (<anonymous>)
at createBaseForm.js:353
at complete (index.js:89)
at index.js:225
at next (util.js:148)
at count (util.js:93)
at cb (index.js:173)
at Object.required [as validator] (required.js:8)
at index.js:216

< hr >

version:
"antd": "^ 2.12.4",
"react": "^ 15.6.1",
"react-dom": "^ 15.6.1",
-
Code:
import {Form, Row, Col, Input, Button, Icon} from "antd";
import React, {Component} from" react";

const FormItem = Form.Item;

class AdvancedSearchForm extends Component {

state = {
    expand: false,
};

handleSearch = (e) => {
    e.preventDefault();
    console.log("",this.props.form.getFieldsValue());
    try{
    this.props.form.validateFields((err, values) => {
        if (!err) {
            console.log("Received values of form: ", values);
        }

    });
    }catch(ex){
        console.log(ex)
    }

}

handleReset = () => {
    this.props.form.resetFields();
}

toggle = () => {
    const { expand } = this.state;
    this.setState({ expand: !expand });
}

getFields() {
    const count = this.state.expand ? 10 : 6;
    const { getFieldDecorator } = this.props.form;
    const children = [];
    for (let i = 0; i < 10; iPP) {
        children.push(
            <Col span={8} key={i} style={{ display: i < count ? "block" : "none" }}>
                <FormItem label={`name${i}`}>
                    {getFieldDecorator(`name${i}`, {
                        rules: [{
                            required: true,
                            message: "",
                        }],
                    })(
                        <Input placeholder="..." />
                    )}
                </FormItem>
            </Col>
        );
    }
    return children;
}

render() {
    return (
        <Form onSubmit={this.handleSearch}>
            <Row gutter={24}>{this.getFields()}</Row>
            <Row>
                <Col span={24} style={{ textAlign: "right" }}>
                    <Button type="primary" htmlType="submit"></Button>
                    <Button style={{ marginLeft: 8 }} onClick={this.handleReset}>
                        
                    </Button>
                    <a style={{ marginLeft: 8, fontSize: 12 }} onClick={this.toggle}>
                        {this.state.expand ? "" : ""} <Icon type={this.state.expand ? "up" : "down"} />
                    </a>
                </Col>
            </Row>
        </Form>
    );
}

}

const WrappedAdvancedSearchForm = Form.create () (AdvancedSearchForm);

export default WrappedAdvancedSearchForm;

< hr >

Primary key reference:
< WrappedAdvancedSearchForm/ >