react setState机制

1. setState方法处理参数是异步，下面set成功之后得写法

this.setState({
            id:e.id,
            period:e.period,
            grade:e.grade,
            subject:e.subjectList
        }, ()=> {
            console.log("编辑------",this.state)
            debugger;
            this.setState({visible: true});
        });

2.下面是页面写法

{this.state.visible?<Modal
                    title="年级"
                    visible={this.state.visible}
                    onOk={this.handleOk}
                    onCancel={this.handleCancel}
                >
                    <Form {...formItemLayout} >
                        <Form.Item label='所属学段'>
                            {getFieldDecorator('period', {
                                initialValue: this.state.period,
                                rules: [{ required: true, message: '所属学段不能为空！' }],
                            })(
                                <Select onChange={this.handleChange} value={this.state.period}>
                                    {
                                        this.state.periodList.map(e => {
                                            return (
                                                <Option  key={e.period} value={e.period}>{e.period}</Option>
                                            )
                                        })
                                    }
                                </Select>
                            )}
                        </Form.Item>
                        <Form.Item label='年级'>
                            {getFieldDecorator('grade', {
                                initialValue: this.state.grade,
                                rules: [{ required: true, message: '年级不能为空！' }],
                            })(
                                <Select onChange={this.handleChangeGrade} value={this.state.grade}>
                                    {
                                        this.state.gradeList.map(e => {
                                            return (
                                                <Option key={e.grade} value={e.grade}>{e.grade}</Option>
                                            )
                                        })
                                    }
                                </Select>
                            )}
                        </Form.Item>
                        <Form.Item label='学科'>
                            {getFieldDecorator('subject', {
                                initialValue: this.state.subject,
                                rules: [{ required: true, message: '学科不能为空！' }],
                            })(
                                <Checkbox.Group style={{ width: '100%' }} onChange={this.onCheckbox}>
                                    <Row>
                                        {
                                            this.state.subjectList.map(e => {
                                                return (
                                                    <Col style={{marginTop:'10px'}} span={8}  key={e.name}>
                                                        <Checkbox value={e.name}>{e.name}</Checkbox>
                                                    </Col>
                                                )
                                            })
                                        }
                                    </Row>
                                </Checkbox.Group>
                            )}
                        </Form.Item>
                    </Form>
                </Modal>:null}