反应路由器 v4 路由事件答案

【问题标题】：React router v4 route events反应路由器 v4 路由事件
【发布时间】：2017-12-06 10:12:47
【问题描述】：

我是新手，之前我使用的是 angular。现在我正在尝试使用 react router v4 构建一个应用程序。我当前的任务听起来很简单：我想为路由添加预加载器和一些身份验证检查。在 Angular 中，我会使用诸如“routechangestart”、“routechangesucess”之类的事件并解析进行身份验证检查。但是，我检查了路由器文档，但没有发现任何这些。我看到的单个选项是使用history.listen()，但它仅在路由更改后触发。所以我的问题是：我怎么知道路线什么时候开始改变，它已经改变了，它是什么路线。

这是我的路由器的样子（我想在预加载器组件中处理这些信息）：

  ReactDOM.render(
    <Router>
      <Provider store={store}>
        <AppContainer>
          <div>
            <Preloader/>
            <Switch>
              <Route exact path="/" component={Main}/>
              <Route path="/app" component={App}/>
              <Route path="/content" component={Content}/>
              <Route path="*" component={Landing}/>
            </Switch>
          </div>
        </AppContainer>
      </Provider>
    </Router>,
    document.getElementById('main')
  );

【问题讨论】：

标签： javascript reactjs web react-router

【解决方案1】：

结帐https://reacttraining.com/react-router/web/example/auth-workflow

您可以扩展 Route 组件以添加您自己的功能。这是非常强大的东西。

要了解有关 RR4 的移动，请查看我的视频（无耻）

https://www.youtube.com/watch?v=Pt_TM6GRTXE&list=PL8vZpHuqa_hPpKUHFlyPkiI4MPexAMhvc

【讨论】：