'Why I can't save Vuex states with vuex-persistedstate and js-cookie?

I'm trying to save Vuex states inside Cookies as I see in the documentation. js-cookies and vuex-persistedstate are imported this way:

import createPersistedState from 'vuex-persistedstate'
import Cookies from 'js-cookie'

Saving the states inside LocalStorage works fine:

 const store = new Vuex.Store({
  state: {

  },
  mutations: {

  },
  getters: {

  },
  modules: {
    user,
    register,
    auth,
  },
  plugins: [createPersistedState()]
})

Trying to save the states in the Cookies I get no Vuex value:

 const store = new Vuex.Store({
  state: {

  },
  mutations: {

  },
  getters: {

  },
  modules: {
    user,
    register,
    auth,
  },
  plugins: [createPersistedState({ 
    storage: {
      getItem: key => Cookies.get(key),
      // Please see https://github.com/js-cookie/js-cookie#json, on how to handle JSON.
      setItem: (key, value) => Cookies.set(y, value, { expires: 3, secure: true }),
      removeItem: key => Cookies.remove(key)
      }
    }
  )]
})

Later edit

Using vuex-persist package all works as expected!

const vuexCookie = new VuexPersistence({
  restoreState: (key, storage) => Cookies.getJSON(key),
  saveState: (key, state, storage) =>
    Cookies.set(key, state, {
      expires: 3
    })
})

// Store
const store = new Vuex.Store({
  state: {

  },
  mutations: {

  },
  getters: {

  },
  modules: {
    chestionare,
    user,
    register,
    auth,
  },
  plugins: [vuexCookie.plugin]
})
vuexjs-cookie


Solution 1:[1]

Try to change this:

[createPersistedState({ 
    storage: {
      getItem: key => Cookies.get(key),
      // Please see https://github.com/js-cookie/js-cookie#json, on how to handle JSON.
      setItem: (key, value) => Cookies.set(y, value, { expires: 3, secure: true }),
      removeItem: key => Cookies.remove(key)
      }
    }
)]

To this:

[createPersistedState({
    key: 'your_key',
    storage: {
      getItem: (key) => JSON.parse(Cookies.get(key)),
      setItem: (key, value) => Cookies.set(key, JSON.stringify(value), {expires: 3, secure: true}),
      removeItem: (key) => Cookies.remove(key)
    }
})]

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 ????? ???????

Related Questions