navigate

Reference

The navigate function is used for imperative navigation.

import { navigate } from "brisa";

// ...
navigate("/some-page");

The navigate function can be used both on the client and on the server. Although there are some differences to be taken into account:

  • If the navigation is done before sending the response (in the middleware, responseHeaders or an API endpoint for example), instead of modifying the navigation history it does a 301 redirect.
  • If it is done during rendering, SPA navigation or Server Action a soft redirect is made.
  • If used inside a client-event or a server-event (action) a new page is always generated in the navigation history.

All i18n navigaton rules apply equally in this function.

Parameters:

  • route: The string with the page route name. Ex: /about-us
  • options: The object with the navigation options. Ex: { renderMode: 'transition' }
    • renderMode: The string with the render mode. Supported: 'transition', 'reactivity', 'native'. (default: 'reactivity' when the render mode is applicable, otherwise 'native')

The usage of renderMode is not applicable in the cases that use a hard redirect. Only is applicable in the cases that use a server soft redirect or execute a client-side navigation. Otherwise, always the native render mode is used.

Returns:

  • Never does not require you to use return navigate('/some') due to using the TypeScript never type.

Avoid using the navigate inside a try/catch block. The navigate is a throwable function and will break the execution of the current function.

Support

Component Support
Server Component โœ…
Web Component โœ…
SSR Web Component โœ…
Actions โœ…
Middleware โœ…
Response headers โœ