javascript - 捕获 "Warning: [react-router] Location '/foo-bar' 与任何路由不匹配”，如果抛出，则重新加载整个页面

Question

我有一个混合react/angularjs应用程序。当路由到 React 中不存在的路由时，我需要重新加载整页，以便服务器可以返回 Angular 页面。我看到抛出错误警告:[react-router]位置'/foo-bar'与任何路由不匹配。我怎样才能拦截它并在发生时重新加载整个页面？

Answer 1

明白了...

const reloadPage = (nextState, replace, callback) => {
  callback("Route not found");
  window.location.reload();
};

const routes = (
  <Route path="/" component={Chrome}>
    <IndexRoute component={Home}/>
    <Route path="catagory" component={CategoryPage}/>
    <Route path="*" onEnter={reloadPage}/>
  </Route>
);

try {
  ReactDOM.render((
      <Router history={browserHistory}>{routes}</Router>
    ),
    rootEl
  );
} catch (err) {
  if (err !== "Route not found") {
    throw err;
  }
}

对于react-router v3，这变为

// From the react-router docs: "If `callback` is listed as a 3rd argument,
// this hook will run asynchronously, and the transition will block
// until `callback` is called."
const reloadPage = (nextState, replace, callback) => {
  window.location.reload();
};

const routes = (
  <Route path="/" component={Chrome}>
    <IndexRoute component={Home}/>
    <Route path="catagory" component={CategoryPage}/>
    <Route path="*" onEnter={reloadPage}/>
  </Route>
);

ReactDOM.render((
    <Router history={browserHistory}>{routes}</Router>
  ),
  rootEl
);