ForgejComponent
es

jComponent

Atajos del estado: INC, TOGGLE, NUL, UPDATE, UNWATCH, WAIT, BLOCKED y CACHEPATH

jComponent 20 · jcomponent@20 jcomponentfrontendstateutilities Ejecutada con jComponent 20

Estas funciones trabajan con el estado de jComponent por ruta ('user.visits'), como SET() y GET(), y todas ellas notifican a los componentes y a los observadores de la ruta.

  • INC(path, [value]) suma value (por defecto 1) a un número; cuando el valor está vacío empieza en 0 y cuando es un texto se lee primero como número.
  • TOGGLE(path) cambia un booleano (un valor vacío pasa a true). NUL(path) y su alias NULL(path) ponen el valor en null.
  • UPDATE(path) (alias UPD) notifica a todos los que usan la ruta sin cambiar el valor: úsalo después de modificar un objeto o un array en el mismo sitio.
  • UNWATCH(path, [fn]) quita los observadores de la ruta creados con WATCH(); con fn, solo ese.
  • WAIT(fn or path, callback) ejecuta callback en cuanto la función devuelve algo verdadero, o la ruta tiene un valor. Comprueba de inmediato y después cada 500 ms.
  • BLOCKED(key, timeout, [callback]) devuelve false la primera vez y true durante los siguientes timeout ms (también vale '5 seconds'): es una protección contra un doble clic o una petición repetida. El callback se ejecuta solo cuando no está bloqueado.
  • CACHEPATH(path, expire, [default]) guarda un valor del estado en la caché (CACHE()): pone la ruta al valor guardado cuando lo hay (o a default, que puede ser una función) y guarda cada cambio bajo la clave path_path.
  • Una ruta es una ruta en el estado de la página, así que un nombre como name o location es una propiedad de window: usa nombres propios (person, prefs.mode).
  • setTimeout2(id, fn, ms, [limit], [param]) es un setTimeout() con debounce: llamarlo de nuevo con el mismo id reinicia el temporizador, así que fn se ejecuta una vez, ms después de la última llamada. Con limit el temporizador se reinicia como mucho ese número de veces y las llamadas siguientes se ignoran hasta que fn se haya ejecutado, así una ráfaga de llamadas no puede aplazarlo para siempre. clearTimeout2(id) lo cancela y devuelve true cuando había uno.
  • CLONE(value) hace una copia profunda (las fechas siguen siendo fechas), COPY(from, to) copia en profundidad las propiedades de un objeto en otro y devuelve to. NOOP es una función que no hace nada y WARN(...) escribe en 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>
Pruébalo en tu navegador

Edita el ejemplo y ejecútalo. Se ejecuta en un marco aislado de tu navegador; no se envía nada a nuestro servidor.

Vista previa