uniapp小程序利用vuex实现计时器刷新不重置

js

import { setStorageSync, getStorageSync } from '@/common/utils/storage.js';

export default {
	state: {  
	     second:getStorageSync('second')?getStorageSync('second'):100, 
	},  
	getters: {},
	mutations: {
		updateTime(state:object){
			this.timer=setInterval(()=>{
				if(state.second == 0){
					state.second = 100;
					return clearInterval(this.timer)
				}
				state.second--;
				setStorageSync('second',state.second)
			},1000)
		}
	}
}

html

<view class="getCode" @tap="getCode">{{second==100?'获取验证码':`已发送(${second})`}}</view>

computed: {
	...mapState({
		second: state => state.forgetPass.second
	})
},
methods: {
	...mapMutations(['updateTime']),
	getCode(){
		//判断是否重置
		if (this.second == 100) {
			//可在此处添加axios请求
			this.updateTime();
		}
	}
}

思路就是在vuex里面声明一个状态然后存到Storage里面持久化