ant design 每次打開Modal彈窗都調用接口重新初始化

要求：每次打開修改彈窗都根據該條數據的ID發請求獲取數據渲染表格

解決辦法：給Modal添加key，每次彈出的時候 改變key的值，保證每次key的值不同

代碼：

在state中設定一個初始值，並在Modal中給模態框設置key

constructor(props) {
        super(props);
        this.state = {
            modalKey:0,
        };
    }

<Modal width={800} title="修改" visible={this.state.editModalVisible}
                        onCancel={() => { this.setState({ editModalVisible: false, modalKey: this.state.modalKey + 1 }); }}
                        onOk={this.handleModalOk.bind(this)}
                        confirmLoading={this.state.confirmLoading}
                        key={this.state.modalKey}
                        >
                    </Modal>

在點擊確定的回調函數中，將state中的modalKey在原來的基礎上加1

handleEditSubmit() {
        const obj = this;
        console.log('原參數：'+obj.state.formData.AGT_ID);
        console.log('修改回調參數1：'+obj.state.formData.reference_id);
        let param = {
            id : obj.state.formData.AGT_ID,
            recomm : obj.state.formData.reference_id,
        }
        const opt = {
          url: agt.info.updateAleAgtInfo,
          type: 'POST',
          dataType: 'json',
          data: param,
        };
        callAjax(opt, (result) => {
          if (result.rspCod === '01000000') {
            openNotice('success', '成功', '提示');
            obj.props.form.resetFields();
            obj.setState({
              modalKey: obj.state.modalKey + 1,
            }, () => {
              obj.setState({
                tdTableReload: false,
              });
            });
          } else {
            openNotice('error', result.rspMsg, '提示');
            obj.setState({
              confirmLoading: false,
            });
          }
        }, () => {
          openNotice('error', rspInfo.RSP_NETWORK_ERROR, '提示');
          obj.setState({
            confirmLoading: false,
          });
        });
    }

在Modal彈窗的取消按鈕中，將state中的modalKey在原來的基礎上加1

<Modal width={800} title="修改" visible={this.state.editModalVisible}
                        onCancel={() => { this.setState({ editModalVisible: false, modalKey: this.state.modalKey + 1 }); }}
                        onOk={this.handleModalOk.bind(this)}
                        confirmLoading={this.state.confirmLoading}
                        key={this.state.modalKey}
                        >
                    </Modal>

這樣就能在每次打開彈窗的時候都能重新刷新彈窗中表格的內容了

參考：https://blog.csdn.net/qq_40319394/article/details/105814183