Versiones comparadas

Clave

  • Se ha añadido esta línea.
  • Se ha eliminado esta línea.
  • El formato se ha cambiado.

...

Bloque de código
languagejs
import store from "../store"

store.getters["token/isLogged"];
store.dispatch("modulo/action", parametro);

Persistir estado

Para que el estado sea persistente cuando se refresque la página, utilizamos vuex-persistedstate, en concreto el plugin createPersistedState(). Para esto, en primer lugar nos descargamos el paquete de npm:

Bloque de código
npm i vuex-persistedstate

Después, como hemos visto antes, podemos especificarlo en la sección plugins de nuestro store:

Bloque de código
languagejs
...,
  // Para hacer que el estado persista tras refrescar la página
  plugins: [createPersistedState()]
})

Si lo pasamos sin argumentos, se hará persistente todo el estado que hayamos definido. Podemos utilizar el parámetro paths para definir qué partes del estado persistir:

Bloque de código
languagejs
// Persistir todo. No se puede utilizar en módulos, sólo en la definición del store general
createPersistedState()

// Persistir un módulo con el nombre que tengamos especificado en el bloque de modules, también sólo en el store general
createPersistedState({ paths: ["modulo"] })

// De la misma forma, podemos persistir las variables del state por su nombre, y esto se puede poner también dentro de los módulos
createPersistedState({ paths: ["variableState"] })

// Desde el store general, podemos persistir ciertas partes de los módulos de esta forma
createPersistedState({ paths: ["modulo/variableState"] })