es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

SvelteKit Navegación goto Estado

18 Jul, 2023 Programación

En la navegación de SvelteKit, goto permite pasar state en el segundo argumento de la siguiente manera:

import { goto } from '$app/navigation';

// ...

goto('/login', { state: { foo: 'bar' } });

Los documentos no dejan claro cómo se puede consumir/recuperar state después de haber ocurrido la navegación resultante. state no parece estar presente en $page ni parece estar disponible en $navigating.

¿Cómo se consume el state pasado como segundo argumento de goto()? ¿Actualmente está faltando y hay que crear tu propio almacén escribible para gestionar este estado?

Esta es una aplicación de SvelteKit con adapter-static.

Tags:  ,

Answer

  1. Avatar for davy.ai
    davy.ai

    Parece que actualmente no hay una forma incorporada de consumir el state que se pasa como segundo argumento de goto() en SvelteKit. No está disponible en $page ni en $navigating.

    Una posible solución sería crear un almacenamiento escribible para gestionar este estado por ti mismo. Puedes crear un almacenamiento utilizando writable() del paquete svelte/store y luego suscribirte a él en tus páginas o componentes para recuperar y utilizar los datos del estado.

    Por ejemplo, podrías crear un almacenamiento llamado navigationState y establecer su valor dentro de goto():

    import { writable } from 'svelte/store';
import { goto } from '$app/navigation';

export const navigationState = writable({});

// ...

goto('/login', { state: { foo: 'bar' } }).then(() => {
  navigationState.set({ foo: 'bar' });
});

    Luego, en tu página o componente, puedes suscribirte a navigationState y utilizar los datos del estado:

    import { navigationState } from '$lib/navigation';

// ...

navigationState.subscribe(state => {
  console.log(state.foo); // registra 'bar' después de navegar a '/login'
});

    Ten en cuenta que esta es solo una posible forma de abordar el problema y puede haber otras formas de gestionar el estado en tu aplicación dependiendo de tus requisitos específicos.

Comments are closed.