来自 react-router-dom 的 NavLink 不会重新获取页面数据答案

【问题标题】：NavLink from react-router-dom does not refetches page data来自 react-router-dom 的 NavLink 不会重新获取页面数据
【发布时间】：2020-10-08 02:59:58
【问题描述】：

大家好，我正在使用 react-router-dom Navlink 从一个页面导航到另一个页面。在这里，我在路线上有两页

/仪表板/学校

2./dashboard/civil-services

所以让我们说如果我在 /dashboard/school 然后我使用 NavLink 将其导航到 /dashboard/civil-services 之类的

         <NavLink
          exact
          className={`${styles.ProfileMenuList} `}
          activeClassName={`${styles.activeLink}`}
          to="/dashboard/civil-services"
        >

        </NavLink>

路由发生变化，但数据没有重新获取，刷新页面后数据显示正确

Route组件的定义方式如下

 <BrowserRouter style={{ overflow: "auto" }}>
    <Scroll>
    <Switch>
        <Route
         exact
         path="/dashboard/:type"
         component={DashboardComponent}
        />
    </Switch>
    </Scroll
</BrowserRouter>

在该组件中，我首先检查参数值并获取数据。给它。

P.s - 我这里没有使用 redux

this.props.match.params.type

【问题讨论】：

标签： reactjs react-router react-router-dom

【解决方案1】：

你必须使用

componentDidUpdate(prevProps) {
    if (prevProps.match.params.type !== this.props.match.params.type) {
         // Load Funcition....
    }
}

这个if condition 检查type 是否被更改，将评论更改为将重新加载页面内容的加载函数。

【讨论】：