useHistoryを使うと画面が真っ白になった

はじめに

useHistoryは廃止されていました。

問題

useHistoryを使ったら画面が真っ白になりエラーになった。

import { useHistory } from "react-router-dom";
export const Top = () => {
  const history = useHistory();
  const onClickAdmin = () => {
    history.push("/users");
  };
};

解決方法

useHistoryはreact-router-dom v6で廃止されました。
v6ではuseNavigateに置き換わっています。

import { useNavigate } from "react-router-dom";
export const Top = () => {
  const navigate = useNavigate();
  const onClickAdmin = () => {
    navigate("/users");
  };
};

おわりに

react-router-dom v6ではuseHistoryが廃止され、useNavigate に統一されました。
v5から移行する際はご注意ください。同じエラーで詰まった方の参考になれば幸いです。