[Vuejs]-Nuxt.js image not show when push refresh button

by

0👍

Your store will be deleted on refresh. So this is expected behaviour.

You have to save your state somehow, to persist it.

The two most popular options are localstorage or a session cookie. With nuxtjs a cookie will be more suitable.

The most used plugin for this is vuex-persiststate.

The following is taken from their documentation:
Sample code:

import { Store } from 'vuex'
import createPersistedState from 'vuex-persistedstate'
import * as Cookies from 'js-cookie'

const store = new Store({
  // ...
  plugins: [
    createPersistedState({
      getState: (key) => Cookies.getJSON(key),
      setState: (key, state) => Cookies.set(key, state, { expires: 3, secure: true })
    })
  ]
})

You need to install js-cookie for the above code to work.

Please refer to the official documentation for more details: https://www.npmjs.com/package/vuex-persistedstate

Leave a comment