Qwik City - useLocation()

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 slug params

useLocation() encodes the URL slugs as params.

Assume you have:

• Route: http://server/sku/[skuId]
• User navigates to: http://server/sku/1234
• Then the skuId can be retrieved through useLocation().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>
  );
});