[Bug]: window.location is not equal to useLocation() with loader in react 17 #10446
Description
What version of React Router are you using?
6.11.1
Steps to Reproduce
package.json
{
"name": "codesandbox-template-vite",
"private": true,
"version": "0.0.0",
"type": "module",
"scripts": {
"dev": "vite",
"build": "tsc && vite build",
"preview": "vite preview"
},
"dependencies": {
"react": "^17.0.0",
"react-dom": "^17.0.0",
"react-router-dom": "^6.11.1"
},
"devDependencies": {
"@types/react": "^17.0.0",
"@types/react-dom": "^17.0.0",
"@vitejs/plugin-react": "^2.0.0",
"typescript": "^4.6.4",
"vite": "^4.3.0"
}
}main.tsx
import React from "react";
import ReactDOM from "react-dom";
import {
createBrowserRouter,
RouterProvider,
useNavigate,
Outlet,
useLocation,
} from "react-router-dom";
const App = () => {
const nav = useNavigate();
return (
<div>
<button onClick={() => nav("/abc?query=123")}>跳转</button>
<Outlet />
</div>
);
};
const Abc = () => {
const location = useLocation();
console.log(
"window.location: {pathname: %s, search: %s}",
window.location.pathname,
window.location.search
);
console.log(
"useLocation(): {pathname: %s, search: %s}",
location.pathname,
location.search
);
return <div>abc</div>;
};
const router = createBrowserRouter([
{
path: "/",
element: <App />,
children: [
{
path: "abc",
element: <Abc />,
loader() {
// whatever code here
return null;
},
},
],
},
]);
ReactDOM.render(
<React.StrictMode>
<RouterProvider router={router} />
</React.StrictMode>,
document.getElementById("root") as HTMLElement
);the result is wrong，window.location get older state。 But if I annotate the loader， it turns right.
Expected Behavior
window.location has same pathname、search ... with useLocation
Actual Behavior
