<p>I want to use localStorage so that the data is saved when the page reloads. <br /><br />I use Vuex to track whether a person is registered. And hopefully when the page loads, the person is already registered. <br /><br />My Vuex code is as follows:</p><p><br /></p> <pre class="brush:php;toolbar:false;">export default { state:{ isRegistered:false }, actions:{ registrate({commit}) { commit("login") }, exit({commit}) { commit("logout") } }, mutations:{ login(state) { state.isRegistered=true; }, logout(state) { state.isRegistered=false } }, getters:{ IS_REGISTERED(state){ return state.isRegistered } } }</pre> <p>Links in my Vue.js</p> <pre class="brush:php;toolbar:false;"><template> <header class="hat"> <div class="header__buttons"> <div v-if="IS_REGISTERED" id="exit--tittle"> <button @click="exitFromSystem">Exit from system</button> </div> <router-link :to="{name:'registration'}"> <button id="registration" v-if="!IS_REGISTERED">Registration</button> </router-link> </div> </header> </template> <script> methods: { ...mapActions(["exit"]), exitFromSystem() { this.exit() // Look in Vuex }, }, </script></pre> <p> Where is the best place to use localStorage to save IS_REGISTERED when reloading the page? </p><p><br /></p>

import Vue from "vue"
import Vuex from "vuex"
import createPersistedState from "vuex-persistedstate";

export default new Vuex.Store({
   modules:{
       // 
   },
   plugins:[createPersistedState()]
}