一、前言

最近寫react antd前端項目，需要頁面加載時調(diào)用下查詢列表的接口。

于是在componentDidMount方法里這樣寫了：

  componentDidMount() {const {dispatch,MyJS: { queryPara },} = this.props;//這個調(diào)用接口查詢列表dispatch({ type: 'MyJS/fetch', queryPara });}

之后，當(dāng)首次打開這個頁面時，確實可以查詢到數(shù)據(jù)列表；

但是關(guān)閉這個頁面后再次打開，就發(fā)現(xiàn)沒有數(shù)據(jù)了，componentDidMount沒有執(zhí)行。

二、解決方法

1.由于關(guān)閉頁面時，沒有銷毀這個頁面，因此再次打開這個頁面，頁面不會重新加載，就不會調(diào)用componentDidMount方法。

2.因此，可以在引入頁面的標(biāo)簽中，加上destroyOnClose，樣例如下：

        <Drawerwidth={1200}title="選擇列表"placement="right"closable={false}onClose={this.onClose1}visible={visible1}destroyOnClose><Mypage onClose={this.onClose1} /></Drawer>

說明：
(1)Drawer標(biāo)簽是import { Drawer } from 'antd';
(2)closable={false}是樣式，false時右上角沒有關(guān)閉按鈕，true時有。
(3)visible控制這個子頁面打開或者關(guān)閉
(4)加上destroyOnClose，就可以當(dāng)頁面關(guān)閉后，銷毀頁面，下次再打開頁面就能觸發(fā)componentDidMount方法了。（如果需要緩存頁面、不需要銷毀，那就去掉這個）
(5)Mypage標(biāo)簽是自己寫的一個頁面，import Mypage from './mypage/index';
(6)onColse是頁面被關(guān)閉時會調(diào)用的方法