vuex数据持久化写法

//==========存储在vuex内的数据，进行调用的时候============
//vuex内部代码写法
state:{
	name:"旧值"
},
mutations:{
	函数1(state){  //1.定义一个函数进行对state.name值的更改
		state.name="新值";
		window.localStorage.setItem("name",JSON.stringify(新值)); //2.更改的时候存入本地
	},
	函数2(state,status){ //4.函数2 接受形参names从新对state.name进行赋值
		state.name=status;
	}
},
actions:{
	函数3({ commit }){ //commit是在axios里面会接收一个ctx,ctx里面解构出来commit
		let names=JSON.parse(localStorage.getItem("name"));
		commit('函数2',names); //3.把获取到本地的值,传入给函数2
	}
}

//vue文件内代码写法
<h1>{ $store.state.name }</h1>
methods:{
	函数(){
		this.$store.commit('函数1') //这里的函数是vuex内的函数1调用
		//commit：同步操作，写法：this.$store.commit('mutations方法名',值)
}
	}
},
mounted(){
	this.$store.dispatch('函数3') //4.这里是调用的vuex里面的函数2
	//dispatch：含有异步操作，例如向后台提交数据，写法： this.$store.dispatch('action方法名',值)
---------------------------
这样一来无论如何刷新值都存在