为什么我收到TypeError:无法读取未定义的REACT-ROUTER-DOM的属性'PUSH'

2022-04-02 00:00:00 reactjs javascript react-router-dom

我只是检查一下我在Redux商店中是否有语言。如果有,我将把它保存在我的localStorage中,如果没有,我想导航到一个组件调用MultiLanguage
我使用了下面的history方法,但它显示了一个错误。它显示了undefined的推送情况,此问题的解决方案是什么?

const history = useHistory();
  const language = store.getState().languages.selectedLangauge.language;
  console.log("language", language);
  if (language) {
    localStorage.setItem("language", language);
  } else {
    history.push("/multilanguage");
  }
  return (
    <div className="font-metropolis_regular">
      <Router>
        <Route path="/" exact component={Selection} />
        <Route path="/login" component={Login} />
        <Route path="/home" component={Homepage} />
        <Route path="/account" component={Account} />
        <Route path="/multilanguage" component={MultiLanguage} />
      </Router>
    </div>
  );


解决方案

原因很简单,正如错误所述,您的useHistory挂钩返回未定义。发生这种情况是因为这个钩子只能在Router包装的组件中调用,因此决策可能会将其上移一级。 请看一下代码示例https://flaviocopes.com/react-router-uselocation-usehistory-undefined/

相关文章