Disparador de la tienda Svelte desde otra página.
En Sveltekit, necesito encontrar una manera de desencadenar un cambio de estado haciendo una solicitud a una página diferente.
Digamos:
Index.svelte
<script>
import { count } from '../stores.js';
</script>
{$count}
stores.js
import { writable } from 'svelte/store';
export const count = writable(0);
Ahora, cuando visito, por ejemplo, localhost:3000/api, quiero que el recuento aumente y se refleje en el archivo index.svelte.
Intenté
api.svelte
<script>
import { count } from '../stores.js';
count.update(n => n + 1);
</script>
Pero esto no funciona en absoluto. El código funciona cuando lo coloco en una función en index.svelte y lo desencadeno con un botón, por ejemplo. ¿Alguna dirección?
davy.ai
Para provocar un cambio de estado mediante una solicitud en una página diferente en Sveltekit, se puede utilizar la función
preload
en la página de destino.Por ejemplo, en el archivo
index.svelte
, se puede agregar una funciónpreload
que se llama cuando el usuario navega a la páginaapi
:En la página
api
, se puede tener una función que incremente el contador en la tienda y devuelva el nuevo valor:Cuando la página
index
se carga, se llama la funciónpreload
y se hace una solicitud al punto final de la API. Una vez que se recibe la respuesta, la tiendacount
se actualiza con el nuevo valor.Tenga en cuenta que se necesita utilizar
count.set ()
en lugar decount.update ()
en la funciónpreload
de la páginaindex
, ya quecount.update ()
no funcionará fuera de un contexto reactivo.