Les effets
Un effet exécute un effet de bord, manipulation du DOM, journalisation, appels réseau, et se ré-exécute dès que ses lectures réactives changent :
import { signal, effect } from '@fluixi/reactive/signal';
const theme = signal('dark');
effect(() => {
document.body.dataset.theme = theme(); // se ré-exécute quand theme change
});
$effect fait la même chose sans l'import, et createEffect est la même fonction sous son nom
d'origine, tout ce qui suit vaut pour les deux.
L'effet s'exécute une fois immédiatement pour établir ses dépendances, puis à chaque changement.
Nettoyage
Enregistrez un nettoyage avec onCleanup. Il s'exécute avant la ré-exécution de l'effet et lors de
sa destruction, idéal pour les minuteurs, écouteurs et abonnements :
import { onCleanup } from '@fluixi/reactive/signal';
effect(() => {
const id = setInterval(tick, delay());
onCleanup(() => clearInterval(id)); // nettoyé avant la prochaine exécution / à la destruction
});
Valeur précédente
La fonction d'effet reçoit sa valeur de retour précédente, pour comparer d'une exécution à l'autre :
effect((prev) => {
const value = count();
if (prev !== value) report(prev, value);
return value;
});
Regroupement (batch)
Plusieurs écritures dans batch ne notifient les dépendants qu'une fois, après le lot :
import { batch } from '@fluixi/reactive/signal';
batch(() => {
first.set('Grace');
last.set('Hopper');
}); // les effets dépendant des deux s'exécutent une seule fois
Suivant : Les stores.