react-router中不同路由使用相同組件重新渲染問題


在項目中,會遇到相同的路由,可能需要使用相同的頁面(容器組件),如果點不同的路由需要重新查詢,但是發現沒有重新進容器的渲染周期,代碼如下:

 export default ({match}) => (
    <Switch>
        <Route path={`${match.url}/med-library`} component={medicineLibraryViews.MedLibrary} />
        <Route path={`${match.url}/trans-library`} component={transLibraryViews.MedLibrary} />
        <Redirect to="/404"/>
    </Switch> 
); 

最后通過給兩個相同的route設置不同的key渲染解決,修改后代碼如下:

export default ({match}) => (
    <Switch>
        <Route path={`${match.url}/med-library`} component={medicineLibraryViews.MedLibrary} key='/med-library' />
        <Route path={`${match.url}/trans-library`} component={transLibraryViews.MedLibrary} key='/trans-library'/>
        <Redirect to="/404"/>
    </Switch> 
); 

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM