Scurtături ale stării: INC, TOGGLE, NUL, UPDATE, UNWATCH, WAIT, BLOCKED și CACHEPATH

jComponent 20 · jcomponent@20 jcomponentfrontendstateutilities Executată cu jComponent 20

Aceste funcții lucrează cu starea jComponent prin cale ('user.visits'), ca SET() și GET(), și fiecare dintre ele notifică componentele și observatorii căii.

INC(path, [value]) adaugă value (implicit 1) la un număr; când valoarea e goală pornește de la 0, iar când e un text este citit mai întâi ca număr.
TOGGLE(path) schimbă un boolean (o valoare goală devine true). NUL(path) și aliasul său NULL(path) setează valoarea la null.
UPDATE(path) (alias UPD) notifică pe toți cei care folosesc calea fără a schimba valoarea: folosește-l după ce ai modificat un obiect sau un array pe loc.
UNWATCH(path, [fn]) elimină observatorii căii creați cu WATCH(); cu fn, doar pe acela.
WAIT(fn or path, callback) rulează callback imediat ce funcția returnează ceva adevărat sau calea are o valoare. Verifică imediat și apoi la fiecare 500 ms.
BLOCKED(key, timeout, [callback]) returnează false prima dată și true pentru următoarele timeout ms (merge și '5 seconds'): este o protecție împotriva unui dublu clic sau a unei cereri repetate. callback rulează doar când nu este blocat.
CACHEPATH(path, expire, [default]) păstrează o valoare a stării în cache (CACHE()): setează calea la valoarea din cache când există (sau la default, care poate fi o funcție) și salvează fiecare schimbare sub cheia path_path.
O cale este o cale în starea paginii, deci un nume precum name sau location este o proprietate a lui window: folosește nume proprii (person, prefs.mode).
setTimeout2(id, fn, ms, [limit], [param]) este un setTimeout() cu debounce: apelul din nou cu același id repornește temporizatorul, deci fn rulează o dată, la ms după ultimul apel. Cu limit, temporizatorul este repornit de cel mult atâtea ori, iar apelurile următoare sunt ignorate până când fn a rulat, așa că un șir de apeluri nu îl poate amâna la nesfârșit. clearTimeout2(id) îl anulează și returnează true când exista unul.
CLONE(value) face o copie profundă (datele rămân date), COPY(from, to) copiază în profunzime proprietățile unui obiect în altul și returnează to. NOOP este o funcție care nu face nimic, iar WARN(...) scrie în 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>

Încearcă în browserul tău

Editează exemplul și rulează-l. Rulează într-un cadru izolat din browserul tău; nimic nu este trimis către serverul nostru.

Cod

Previzualizare