1
resposta

Perda da Store após Refresh

Bom dia a todos, depois de fazer aplicação rodar com autenticação, Vuex e tal constatei que depois de dar um F5 eu perdia a store armazenada e depois de um dia pesquisando eu encontrei a solução, que no meu caso foi usa um pluguin chamado

npm install --save vuex-persistedstate
import { Store } from "vuex";
import createPersistedState from "vuex-persistedstate";
import * as Cookies from "js-cookie";

const store = new Store({
state: value,
  // ...
  plugins: [
    createPersistedState({
      storage: {
        getItem: (key) => Cookies.get(key),
       setItem: (key, value) =>
          Cookies.set(key, value, { expires: 3, secure: true }),
        removeItem: (key) => Cookies.remove(key),
      },
    }),
  ],
});

Ele coloca os dados da Store armazenados em um cookie, equando perde o store ele vai buscar essa informação nesse cookie, passar secure=false quando não rodar em https , para a solução utilizando cookie também é reciso instalar o js-cookie

$ npm i js-cookie

O pluguin também permite salvar a store no localStorage ao ínves de utilizar cookies


const store = new Store({
state: value,
  // ...
  plugins: [
    createPersistedState({
      storage: {
       key:"xibiu",
      getState() => {
       if(localStorage.getItem("xibiu")){
     Object.assign(value,JSON.parse(localStorage.getItem("xibiu"));
      }        
      }
      },
    }),
  ],
});

`

Bom esse código pode ajudar alguns a não perder um dia procurando por uma solução

1 resposta

Oi, Ricardo, tudo bem?

Obrigada demais por compartilhar sua solução conosco! Bons estudos :}