ForgejComponent
fr

jComponent

Raccourcis d'état : INC, TOGGLE, NUL, UPDATE, UNWATCH, WAIT, BLOCKED et CACHEPATH

jComponent 20 · jcomponent@20 jcomponentfrontendstateutilities Exécutée avec jComponent 20

Ces fonctions travaillent sur l'état de jComponent par chemin ('user.visits'), comme SET() et GET(), et chacune notifie les composants et les observateurs du chemin.

  • INC(path, [value]) ajoute value (par défaut 1) à un nombre ; quand la valeur est vide elle part de 0, et quand c'est un texte il est d'abord lu comme un nombre.
  • TOGGLE(path) change un booléen (une valeur vide devient true). NUL(path) et son alias NULL(path) mettent la valeur à null.
  • UPDATE(path) (alias UPD) notifie tous ceux qui utilisent le chemin sans changer la valeur : utilisez-le après avoir modifié un objet ou un tableau sur place.
  • UNWATCH(path, [fn]) supprime les observateurs du chemin créés avec WATCH() ; avec fn, seulement celui-là.
  • WAIT(fn or path, callback) exécute callback dès que la fonction renvoie une valeur vraie, ou que le chemin a une valeur. Il vérifie tout de suite puis toutes les 500 ms.
  • BLOCKED(key, timeout, [callback]) renvoie false la première fois et true pendant les timeout ms suivantes ('5 seconds' fonctionne aussi) : c'est une protection contre un double clic ou une requête répétée. Le callback ne s'exécute que lorsque ce n'est pas bloqué.
  • CACHEPATH(path, expire, [default]) garde une valeur de l'état dans le cache (CACHE()) : il met le chemin à la valeur en cache s'il y en a une (ou à default, qui peut être une fonction) et enregistre chaque changement sous la clé path_path.
  • Un chemin est un chemin dans l'état de la page, donc un nom comme name ou location est une propriété de window : utilisez des noms à vous (person, prefs.mode).
  • setTimeout2(id, fn, ms, [limit], [param]) est un setTimeout() avec debounce : l'appeler de nouveau avec le même id redémarre le minuteur, donc fn s'exécute une fois, ms après le dernier appel. Avec limit, le minuteur est redémarré au plus ce nombre de fois et les appels suivants sont ignorés jusqu'à ce que fn ait tourné, si bien qu'un flot d'appels ne peut pas le repousser indéfiniment. clearTimeout2(id) l'annule et renvoie true s'il y en avait un.
  • CLONE(value) fait une copie profonde (les dates restent des dates), COPY(from, to) copie en profondeur les propriétés d'un objet dans un autre et renvoie to. NOOP est une fonction qui ne fait rien et WARN(...) écrit dans console.warn.
public/index.html
<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8" />
	<title>jComponent</title>
	<link rel="stylesheet" href="//cdn.componentator.com/spa.min@20.css" />
	<script src="//cdn.componentator.com/spa.min@20.js"></script>
</head>
<body>
	<p class="out"></p>
	<script>

		window.sample = { watched: 0 };

	</script>
</body>
</html>
Essayez-le dans votre navigateur

Modifiez l'exemple et exécutez-le. Il s'exécute dans un cadre isolé de votre navigateur ; rien n'est envoyé à notre serveur.

Aperçu