useLocation
Read the current pathname and search string.
useLocation returns the current location of the surface's router.
import { useLocation } from "extrojs/navigation"
const { pathname, search } = useLocation()Reference
useLocation()
Takes no arguments. Returns:
pathname: string: the current route path, normalized to start with/(for example"/"or"/settings").search: string: the raw query string without the leading?(for example"tab=files&sort=recent", or""when absent).
The component re-renders on every navigation.
Caveats
- Must be called inside a routable surface; throws elsewhere.
searchis the raw string. To parse or update it, useuseSearchParamsinstead.
Usage
Showing the current location
import type { LayoutProps } from "extrojs/navigation"
import { useLocation } from "extrojs/navigation"
export default function Layout({ children }: LayoutProps) {
const { pathname } = useLocation()
return (
<div>
<header>{pathname === "/" ? "Home" : pathname}</header>
{children}
</div>
)
}Active navigation state
See the active link example on the Link page.