在 React Router v5 中,历史对象有一个监听方法。使用该方法,我编写了一个 usePathname 挂钩来在路径更改时重新呈现组件。在 React Router v6 中,这个方法不再存在。像这样的事情有替代方案吗?我不想使用 useLocation 因为如果状态发生变化它也会呈现,而在本例中我不需要。
该钩子与 v5 一起使用。
import React from "react";
import { useHistory } from "react-router";
export function usePathname(): string {
let [state, setState] = React.useState<string>(window.location.pathname);
const history = useHistory();
React.useLayoutEffect(
() =>
history.listen((locationListener) => setState(locationListener.pathname)),
[history]
);
return state;
}
Run Code Online (Sandbox Code Playgroud)