javascript - 如何从 react route 获取 href id？

Question

我正在尝试从react.js项目中获取路由ID，如下所示:page1#view-all

我尝试使用原生 JavaScript document 和 window 但不幸的是，由于 SSR，我无法以这种方式获得它。

除了上述功能之外，还有什么替代方案吗？如何获取带有 href id 的路由器链接？ page1#view-all

谢谢

仅供引用，我在使用 document 或 window 时遇到的错误，我发现其中任何一个都未定义。

这是一个代码片段:

<Link
                to="/page1#view-all"
                className={`subItem-anchor
                ${
                  route && route.split("/")[route.split("/").length - 1] === "all-projects"
                    ? "subnavitemHighlightd"
                    : ""
                }`}
              >

route 实际上是其他路由，例如 page1/another-sub-page 但我无法获取 page1#view-all

Answer 1

使用react-router-dom

import { useLocation } from 'react-router-dom'

像这样访问

  let location = useLocation()
  console.log(location);

useLocation 钩子(Hook)返回包含 pathname、search、hash、 的位置对象key 和当前位置的状态属性。

访问示例代码

function App(){

let location = useLocation()
return(
<h3>Access from useLocation</h3>
)}

或者如果它是基于类的组件，则可以像这样访问而不导入任何内容

let urlData = this.props.location;
console.log(urlData);