react.js的下拉联动

react.js的下拉联动

import React from 'react';
import { Row, Col, Form, Select, Input } from 'antd';

const FormItem =Form.Item;
const Option=Select.Option;
class Test extends React.PureComponent{
   constructor(props){
      super(props)
      this.state={
         typeState: '',
      }
   }
   //onchange回调
   typeFun = () => {
       this.setState({
        typeState: value,
       })
   }
   render(){
       const { getFieldDecorator } = this.props.form;
       return(
           <div>
               <Row>
                   <Col span={8}>
                        <FormItem label="类别">
                            {/* type是字段名 */}
                            {getFieldDecorator('type', {
                               initialValue: this.props.data.type, // 后台反的数据
                                })(
                                    <Select optionFilterProp="children" onChange={this.typeFun}>
                                        {/* LX为数据字典即 好多类别名称放在一起 */}
                                        {this.props.LX.map((item, index)=>(
                                          <Option key={index} value={item.number}>{item.name}</Option>
                                        ))}
                                    </Select>
                                )}
                        </FormItem>                 
                   </Col>
                   <Col span={8}>
                      <FormItem label="类别代码">
                      {getFieldDecorator('typeCode', {
                               initialValue: this.state.typeState === '' ? this.props.typeCode : this.state.typeState,
                                })(<Input disabled/>)}
                      </FormItem>
                   </Col>
               </Row>
           </div>
       )
   }
}
export default Test