Skip to content

Latest commit

 

History

History
115 lines (83 loc) · 3.02 KB

signal.mdx

File metadata and controls

115 lines (83 loc) · 3.02 KB
title description sidebar
Signal
The base class for all signals in Reactter.
order
0.1

import { HM, HT } from '@/components/Highlight'; import MDXRedry from '@/components/MDXRedry.astro'; import StateMethodsLite from '@/content/docs/shareds/state_methods_lite.mdx'; import * as NoteLateState from '@/content/docs/shareds/note_late_state.mdx'; import * as NoteStateValueNotifies from '@/content/docs/shareds/note_state_value_notifies.mdx'; import * as ListeningChangesState from '@/content/docs/shareds/listening_changes_state.mdx';

Signal is reactive state that encapsulate a value changing over time. When the value of a signal changes, it automatically notifies its observers.

Syntax

  Signal<T>(T initialValue);

Signal accepts this property:

  • initialValue: Initial value of T type that the it will hold.

Properties & Methods

Signal provides the following properties and methods:

  • value: A getter/setter that allows to read and write its state.

Usage

Declaration

Signal can be initialized using the constructor class:

final intSignal = Signal<int>(0);
final strSignal = Signal("initial value");
final userSignal = Signal(User());

<MDXRedry mdx={NoteLateState} vars={{stateName: 'Signal'}}>

class CounterController {
  final int initialCount;

  late final count = Reactter.lazyState(
    () => Signal(this.initialCount),
    this
  );

  Counter([this.initialCount = 0]);
}

Reading and writing the value

Signal has a value property that allows to read and write its state:

intSignal.value = 10;
print("Current state: ${intSignal.value}");

or also can use the callable function:

intSignal(10);
print("Current state: ${intSignal()}");

or simply use .toString() implicit to get its value as String:

print("Current state: $intSignal");

<MDXRedry mdx={NoteStateValueNotifies} vars={{ stateName: 'Signal', }}/>

Updating the value

Use update method to notify changes after run a set of instructions:

userSignal.update((user) {
  user.firstname = "Firstname";
  user.lastname = "Lastname";
});

Use refresh method to force to notify changes.

userSignal.refresh();

Listening to changes

<MDXRedry mdx={ListeningChangesState} vars={{ stateName: 'Signal', stateVariable: 'mySignal', }}/>

:::note[With Flutter] ReactterWatcher is a way to keep the widgets automatically updates, accessing the value of Signal reactively. :::