我导入了`<Routing/>`

问题描述

我将 <Routing/> 导入 Main App，然后出现错误 TypeError: Object(...) is not a function。

我的应用程序在没有组件的情况下工作，但我需要修复这个错误。 请帮帮我。

const Routing = () => {
  const history = useHistory();
  const { state,dispatch } = useContext(UserContext);

  useEffect(() => {
    const user = JSON.parse(localStorage.getItem("user"));

    if (user) {
      dispatch({ type: "USER",payload: user });
    } else {
      if (!history.location.pathname.startsWith("/reset"))
        history.push("/signin");
    }
  },[]);

  return ();
};


function App() {
  return (
    <>
           ***<Routing />***
    </>
  );
}

解决方法

基本示例Live Demo CodeSandbox：

const Routing = () => <h1>Hello from Routing</h1>;

function App() {
  return (
    <>
      <Routing />
    </>
  );
}

export default App;

---

带更正的完整代码：

const Routing = () => {
  const history = useHistory();
  const { state,dispatch } = useContext(UserContext);
  useEffect(() => {
    const user = JSON.parse(localStorage.getItem("user"));
    if (user) {
      dispatch({ type: "USER",payload: user });
    } else {
      if (!history.location.pathname.startsWith("/reset"))
        history.push("/signin");
    }
  },[]);
  return <></>;
};

function App() {
  return (
    <>
      <Routing />
    </>
  );
}

export default App;

,

我修好了。我从“反应”中导入了 useHistory。这是错误的。正确答案：来自'react-router-dom'的useHistory