| Tabla de contenidos |
|---|
...
¿Puedo usar Vuex?
SÍ, PERO...
Como vamos a ver a continuación, Vuex sirve para guardar el estado global de la aplicación. Este estado por defecto es volátil, cuando salgamos de la aplicación (ya sea cerrando la ventana, navegando a otro sitio, etc) este estado se borrará.
Veremos que tenemos una opción para hacer este estado persistente, para poder mantenerlo aunque salgamos de la aplicación, pero esto guarda los datos en el local storage del navegador, los hace accesibles, por lo tanto, podemos usar Vuex, pero bajo ningún concepto podemos perisitir datos de usuario u otros datos sensibles.
Si necesitamos guardar estos datos, debemos hacerlos a través del backend, gestionando sesiones como se explica en esta guía: Gestión de sesiones web.
¿Qué es Vuex?
Vuex es una librería que ofrece Vue para gestionar el estado de la aplicación, centralizar información y funciones, haciéndolas accesibles desde cualquier componente. Se organiza de la siguiente manera:
...
| Bloque de código | ||
|---|---|---|
| ||
import store from "../store"
store.getters["token/isLogged"];
store.dispatch("modulo/action", parametro); |
Persistir estado
...
estado
...
| Advertencia |
|---|
Este plugin guarda la parte del estado que indiquemos en el local storage del navegador, es decir, se queda accesible, por lo que debemos asegurarnos de no guardar nada de información sensible. |
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:
...