rerenderInAction

Reference

rerenderInPage({ type, renderMode, props }: RerenderInAction): Never

The rerenderInAction method is used to rerender the component or the page inside a server action. Outside of an action, it throws an error.

rerenderInAction needs to be called outside of the try/catch block:

import { rerenderInAction } from "brisa/server";

// Inside a server action
function handleEvent() {
  try {
    // ...
  } catch (error) {
    // ...
  }

  // Trigger a full-page rerender
  rerenderInAction({ type: "page" });
}

Example of Component Rerender:

export default function MyComponent({ text = "foo" }: { text: string }) {
  function handleClick() {
    // Trigger a component rerender with new props
    rerenderInAction({ type: "targetComponent", props: { text: "bar" } });
  }

  return (
    <div>
      <button onClick={handleClick}>{text}</button>
    </div>
  );
}

See the differences between "Action Signals" and rerenderInAction in this documentation.

Types:

function rerenderInAction<PropsType>(
  props: RerenderInActionProps<PropsType> = {},
): never;

type RerenderInActionProps<T> =
  | {
      type?: "currentComponent" | "targetComponent";
      renderMode?: RenderMode;
      props?: T;
    }
  | {
      type?: "page";
      renderMode?: RenderMode;
    };

Parameters:

  • type: The type of the rerender. It can be currentComponent, targetComponent or page. By default, it is currentComponent, this means that it is going to rerender the component that called the rerenderInAction method. When using targetComponent it is going to rerender the component that fired the original action. When using page it is going to rerender the whole page.
  • renderMode: The type of the rerender. It can be reactivity or transition. By default, it is reactivity. When using transition it is done under View Transition API.
  • props: The props to be passed to the component when rerendering.

Returns:

  • Never does not require you to use return rerenderInPage() due to using the TypeScript never type.

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

Updating Action Signals by default is going to use a rerenderInAction with component type and reactivity mode without you having to specify it. If you specify it, it will fulfill only the rerenderInAction you specify.

Support

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