Class ReactiveProps<T>

ReactiveProps is a reactive primitive that holds a shallow object. It is the base unit of reactive state. It is a shallow reactive object, meaning that it only tracks changes to the properties of the object itself, not its nested properties.

Example

const b = new ReactiveProps({ foo: 1 });

let bar = 0;

b.subscribe(() => {
bar += 1;
});

const props = b.data;
props.foo = 2;

console.log(bar);
// Outputs: 1

Example

class A {
foo = 1;

inc() {
this.foo++;
}
}

let bar = 0;
const b = new ReactiveProps(new A(), { name: "b" });

b.subscribe(() => {
bar++;
});

console.log(b.data.foo);
// Outputs: 1

b.data.foo = 2;
console.log(b.data.foo);
// Outputs: 2

console.log(bar);
// Outputs: 1

b.data.inc();
console.log(b.data.foo);
// Outputs: 3
console.log(bar);
// Outputs: 2

Type Parameters

  • T

Hierarchy (view full)

Constructors

Properties

#handler: ProxyHandler<T>
#proxy: T
#target: T
engine: any
name: string
options: {
    compareFunction: any;
    name: string;
} = ...

Type declaration

  • compareFunction: any
  • name: string

Accessors

  • get data(): T
  • Retrieves the proxied value of the ReactiveProps. If the engine is destroyed, an error is thrown. Tracks the ReactiveProps for dependency management.

    Returns T

    The proxied value of the ReactiveProps.

  • set data(value): void
  • Sets the value of the ReactiveProps. If the value is an object, it will be proxied and reactive. This is a synonym for set value(value).

    Parameters

    • value: T

      The new value of the ReactiveProps.

    Returns void

  • get isDestroyed(): boolean
  • Returns boolean

    True if the reactive item has been destroyed, false otherwise.

  • get value(): T
  • Retrieves the proxied value of the ReactiveProps. If the engine is destroyed, an error is thrown. Tracks the ReactiveProps for dependency management.

    Returns T

    The proxied value of the ReactiveProps.

  • set value(value): void
  • Sets the value of the ReactiveProps. If the value is an object, it will be proxied and reactive.

    Parameters

    • value: T

      The new value of the ReactiveProps.

    Returns void

Methods

  • Destroys the reactive item. This method is useful for cleaning up after a reactive item that is no longer needed. It calls destroy on the engine of the reactive item, which removes all dependencies, dependents and subscribers, and marks the engine as destroyed.

    Returns void

  • Checks if two values are equal. If the compareFn property is a function, it is used to compare the two values. If the compareFn property is not a function, the values are compared using the === operator. If the optional second argument is not provided, the value of the reactive item is used.

    Parameters

    • a: any

      The first value to compare.

    • Optional b: any

      The second value to compare. If not provided, the value of the reactive item is used.

    Returns boolean

    True if the two values are equal, false otherwise.

  • Returns the raw, unproxied value of the ReactiveProps. This is generally not recommended as it breaks reactivity.

    Returns T

    The raw, unproxied value of the ReactiveProps.

  • Retrieves the proxied value of the ReactiveProps. If the engine is destroyed, an error is thrown. Tracks the ReactiveProps for dependency management.

    Parameters

    • Optional options: {
          untracked?: boolean;
      }

      Optional options. If untracked is false, the ReactiveProps value will be added to the getValueTracker.

      • Optional untracked?: boolean

    Returns T

    The proxied value of the ReactiveProps.

  • Returns true if there has been an error while calculating the value of the reactive item, false otherwise. This method returns true if the reactive item has been destroyed, if the reactive item has an error, or if the calculation of the value of the reactive item has thrown an error.

    Returns boolean

    Whether there has been an error while calculating the value of the reactive item.

  • Subscribes a function to be called when the reactive item is destroyed. The function is called with no arguments.

    Parameters

    • fn: ((reactiveItem) => void)

      The function to be called.

    Returns (() => void)

    A function that unsubscribes the given function.

      • (): void
      • Returns void

  • Subscribes a function to be called whenever a subscriber is added to the reactive item. The function is called with no arguments.

    Parameters

    • fn: (() => void)

      The function to be called.

        • (): void
        • Returns void

    Returns (() => void)

    A function that unsubscribes the given function.

      • (): void
      • Returns void

  • Subscribes a function to be called whenever there are no longer any subscribers. The function is called with no arguments.

    Parameters

    • fn: (() => void)

      The function to be called.

        • (): void
        • Returns void

    Returns (() => void)

    A function that unsubscribes the given function.

      • (): void
      • Returns void

  • Sets the value of the ReactiveProps. If the value is an object, it will be proxied and reactive.

    Parameters

    • value: T

      The new value of the ReactiveProps.

    Returns void

  • Subscribes a function to be called whenever the value of this reactive item changes.

    Parameters

    • fn: ((updates) => void)

      The function to be called whenever the value of this reactive item changes.

    • Optional options: {
          delay: number;
          signal: AbortSignal;
      }

      Optional options.

      • delay: number

        The delay in milliseconds before the function is called.

      • signal: AbortSignal

        The signal to abort the subscription.

    Returns Unsubscriber