foundation-utils.renderonchange

Home > @genesislcap/foundation-utils > renderOnChange

renderOnChange() function

Defines a property changed handler that calls a render() method on the target as an internal observation enhancement.

Signature:

export declare function renderOnChange(target: FASTElement & {
    render(): void;
}, name: string): void;

Parameters

Parameter	Type	Description
target	FASTElement & { render(): void; }	The target to define the property change handler on.
name	string	The property name.

Returns:

void

Remarks

This is useful if you have a lot of properties that all invalidate the internal state. See https://www.fast.design/docs/fast-element/observables-and-state#internal-observation for more information.

Example

 @attr({ mode: 'boolean', attribute: 'line-numbers' })
 @renderOnChange
 lineNumbers: boolean = true;

 @attr
 @renderOnChange
 indent: number | 'tab' = 2;

 render() {
   if (!this.$fastController.isConnected) {
     return;
   }
   // Do something...
 }