HashRouter下useLocation与window.location返回值不一致问题咨询

这是React Router的正常设计逻辑，不是Bug，不需要提交GitHub Issue。不同路由组件下useLocation的行为确实存在明确区别：

• HashRouter：它将浏览器URL中的hash部分作为自身的路由路径来解析。也就是说，window.location.hash（比如#/testpath/123）会被提取为useLocation返回的pathname；而useLocation的hash字段，只对应hash中额外的锚点部分（比如如果URL是/myPage/#/testpath/123#section，那useLocation.hash会是#section）。如果你的hash里只有路由路径没有额外锚点，useLocation.hash自然为空。

• BrowserRouter：直接使用浏览器原生的window.location.pathname作为路由路径，此时useLocation.pathname和window.location.pathname完全一致；useLocation.hash则对应window.location.hash（即URL中#后面的锚点内容）。

• MemoryRouter：完全脱离浏览器的window.location，在内存中独立维护路由状态。useLocation返回的所有字段都和浏览器地址栏无关，仅对应内存中的路由信息。

你的示例验证 #

window.location的值：

{
  pathname: "/myPage/"
  hash: "#/testpath/123"
  search: ""
}

useLocation()返回的值：

{
  pathname: "/testpath/123"
  hash: ""
  search: ""
  key: "abc123"
  state: null
}

这里HashRouter把#/testpath/123解析为内部路由路径/testpath/123，因为hash里没有额外锚点，所以useLocation.hash为空，完全符合预期。

内容的提问来源于stack exchange，提问作者Matt Strom