有人这样描绘四姑娘山:四姑娘山孕育着银色冬天的梦幻,绿色春天的生命,金色秋天的希望,蓝色夏天的憧憬。四姑娘山,走进她,靠近她,你才知道什么是美,这种美带给你的是各种不同的感受,四季轮转中也无改她的美丽,四姑娘山如婉约的少女,又如豪壮的勇士,伫立在天地间,无比的圣洁,不愧是蜀山之后,东方的阿尔卑斯。
方式一、使用localStorage在数据存储
1、要在浏览器刷新的时候重新存储起来
if (window.localStorage.getItem(authToken)) {
store.commit(types.SETLOANNUMBER, window.localStorage.getItem('loanNumber'));
}
方式二、使用vue-cookie插件来做存储
1、参考地址传送门
2、安装包
npm install vue-cookie --save
3、在store中存储起来
import Vue from 'vue';
import Vuex from 'vuex';
Vue.use(Vuex)
var VueCookie = require('vue-cookie');
export default new Vuex.Store({
state: {
token: VueCookie.get('token')
},
mutations: {
saveToken(state, token) {
state.token = token;
// 设置存储
VueCookie.set('token', token, { expires: '30s' });
}
},
actions: {
}
})
4、在登录页面中设置到存储中
import { mapMutations } from 'vuex';
export default {
methods: {
login() {
this.saveToken('123')
},
...mapMutations(['saveToken'])
}
};
方式三、使用vuex-persistedstate插件参考文件
在做大型项目,很多数据需要存储的建议使用这种方式
本文vue项目持久化存储数据的如何实现代码到此结束。记得三个尊:尊重自已,尊重别人,保持尊严,对自已的行为负责。小编再次感谢大家对我们的支持!