我導入了`<routing /> `

Question

我將<Routing/>導入到主應用程序，然后出現錯誤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 />***
    </>
  );
}

Answer 1

基本示例示例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;

Answer 2

我解決了。 我從'react'導入了useHistory。 這是錯誤的。 正確答案：'react-router-dom' 中的 useHistory