useLocation()
Qwik City - Use useLocation()
to retrieve the current location (URL).
The return value of useLocation()
is equivalent to document.location
, but it is safe to use on the server where there is no global document
object.
Path Route Parameters
useLocation()
encodes the Route Parameters as params.
Assume you have:
- Route:
https://example.com/sku/[skuId]
- User navigates to:
https://example.com/sku/1234
- Then the
skuId
can be retrieved throughuseLocation().params.skuId
.
export default component$(() => {
const location = useLocation();
return (
<Host>
<h1>SKU</h1>
<p>pathname: {location.pathname}</p>
<p>skuId: {location.params.skuId}</p>
</Host>
);
});