在Vue中使用localStorage。在哪里需要使用它？
<p>我想使用localStorage，这样当页面重新加载时，数据能够保存下来。<br /><br />我使用Vuex来追踪一个人是否已注册。并且希望当页面加载时，这个人已经注册。<br /><br />我的Vuex代码如下：</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>我的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> 在重新加载页面时，最好在哪里使用localStorage来保存IS_REGISTERED？</p><p><br /></p>
1
862
![ThinkPHP5快速开发企业站点[全程实录]](https://img.php.cn/upload/course/000/000/068/6253d918a3ce7278.png)
收藏
Translation: 我自己解决了这个问题，// npm-> npm install vuex-persistedstate // OR // yarn-> yarn add vuex-persistedstate
在我的store中，需要像这样添加：
import Vue from "vue" import Vuex from "vuex" import createPersistedState from "vuex-persistedstate"; export default new Vuex.Store({ modules:{ // }, plugins:[createPersistedState()] }