smolter
API

useNavigate

Navigate to a URL or move through browser history.

Compatibility

ReactAvailable in this renderer's browser integration.
React SSRAvailable to this renderer's SSR integration; browser event handlers run after hydration.
PreactAvailable in this renderer's browser integration.
Preact SSRAvailable to this renderer's SSR integration; browser event handlers run after hydration.

Import from @kasperrt/smolter/react @kasperrt/smolter/preact

Signature

function useNavigate(): NavigateFunction;

Parameters

The hook takes no arguments. The returned NavigateFunction accepts a string URL, a number of history entries, or an object with pathname, search, and hash. Its optional second argument contains NavigateOptions.

Returns

Returns a stable callback for the current router. The callback returns void, including for URL navigation. If you need to await navigation, call useRouter().navigate instead.

Example

The object form retains omitted URL parts. Set search or hash to an empty string when you want to remove them.

import { useNavigate } from "@kasperrt/smolter/preact";

export function SearchControls() {
  const navigate = useNavigate();

  return (
    <button onClick={() => navigate({ search: "", hash: "" }, { replace: true })}>
      Clear search
    </button>
  );
}

History and deployments

A numeric target calls window.history.go and is browser-only. URL targets go through the router and its installed navigation integrations. Use mountApplication when you need browser history state, retained views, and deployment handoff behavior; a bare provider does not install all those integrations. For ordinary navigable content, prefer Link so users retain anchor interactions.

View implementation ↗