Lifecycle HooksLink to heading

When live components re-render, the framework calls several lifecycle hooks methods that can be defined by the host application to customize render behavior.

The before_update hookLink to heading

The before_update hook is called immediately before a component renders or re-renders and receives the current state as an argument.

import { live, LiveController, type State } from "@camertron/live-component";

@live("ExampleComponent")
export class ExampleComponent extends LiveComponent {
  before_update(state: State) {
    // your code here
  }
}

import { live, LiveController, type State } from "@camertron/live-component";

@live("ExampleComponent")
export class ExampleComponent extends LiveComponent {
  before_update(state: State) {
    // your code here
  }
}

The after_update hookLink to heading

The after_update hook is called after a component renders or re-renders and receives no arguments.

import { live, LiveController, type State } from "@camertron/live-component";

@live("ExampleComponent")
export class ExampleComponent extends LiveComponent {
  after_update() {
    // your code here
  }
}

import { live, LiveController, type State } from "@camertron/live-component";

@live("ExampleComponent")
export class ExampleComponent extends LiveComponent {
  after_update() {
    // your code here
  }
}

Serialization

React integration

Lifecycle Hooks Link to heading

The before_update hook Link to heading

The after_update hook Link to heading

Lifecycle HooksLink to heading

The before_update hookLink to heading

The after_update hookLink to heading