使用ant design的modal中嵌入form表單,動態獲取數據

最近在作一個公司的項目，使用的是react而後用了ant design，在作一個功能的時候使用了modal,modal裏面還嵌套了一個子組件，就想子組件裏的id能動態獲取而後從接口拉數據，可是始終不行由於componentWillMount這個只進去的時候會渲染，後面就不會了。折騰了大半天也上了相關論壇，什麼onRef 呀，或者直接帶事件的方法，只要進了Modal都不行，後來終於發現一個modal的相關參數實現了。如下是具體代碼：

//這是點擊事件
    onChange = (e) => {
        // console.log(e);
        this.setState({
            currentDevId: e.record.id, 
            title:e.record.device_name,
            visible:true
        });
    }

此處設置destroyOnClose={true}便可

<Modal
    title={"設備資料管理 - "+this.state.title}
    width={850}
    style={{ top: 20 }}
    visible={this.state.visible}
    onOk={this.handleOk}
    onCancel={this.handleCancel}
    destroyOnClose={true}
    okText="保存"
    cancelText="取消"
    >
        <Tabs>            
            <TabPane tab="基礎信息" key="1" >
                <BasicInfo onRef={this.onRef} devid={this.state.currentDevId} />
            </TabPane>
            <TabPane tab="運行參數" key="2"><RunParams dvid={this.state.currentDevId} /></TabPane>
        </Tabs>
    </Modal>

而後子組件在componentWillMount裏面經過Props接收 便可
或者還能夠在態窗的取消按鈕添加事件，以下

resetFields()  //重置一組輸入控件的值（爲 initialValue）與狀態，如不傳入參數，則重置全部組件

附正常狀況父組件調用子組件事件的方法-直接上代碼：
父組件：

import React from 'react';
import {Button} from 'antd';
import Hz from './Child';

export default class Inspect extends React.Component {

    onRef = (ref) => {
        this.child = ref
    }

    click = (e) => {
        // this.child.myName()
    }

    render() {
        return(
            <div>
                <Hz onRef={this.onRef} />
                <Button onClick={this.click} >設備巡檢....</Button>
            </div>
        )
    }
}

子組件：

import React from 'react';

export default class Child extends React.Component {
    
    componentDidMount(){
        this.props.onRef(this)
    }

     myName = () =>{
      alert(11111111111111)

     }

    render() {
        return(
            <div>設備巡檢子組件....</div>
        )
    }
}