标签：setStorageSync 微信 app console state userInfo infoRes uni

我这个小白主要用的是vuex结合着uni-app自带的本地缓存调用

APIuni.setStorageSync('key', value)、uni.getStorageSync('key')

1、根目录新建store/index.js

import Vue from "vue";
import Vuex from "vuex"

Vue.use(Vuex);

const store = new Vuex.Store({
	state: {
		// 是否登录标识
		hasLogin: false,
		// 账号数据
		userInfo: {
			id: "",
			nikeName: '',
			userName: '',
			phone: '',
			avatarUrl: '',
			openId: '',
		}
	},
	mutations: {
		// login 登录
		login(state, userInfo) {
			// state.hasLogin = true;
			state.userInfo = userInfo;
			uni.setStorageSync('userInfo', userInfo)
		},
		// logout 注销
		logout(state) {
			state.userInfo = {};
			state.hasLogin = false;
			uni.clearStorageSync('userInfo');
		}
	}
})
export default store

2、main.js配置

 3、在需要使用的页面引入

<template>
	<view class="login">
		<view @click="hidenLoginPopup" class="login-popup">
			<view class="login-text">
				<text style="font-size: 28rpx;letter-spacing: 4rpx;">您還未登錄</text>
				<text style="font-size: 22rpx;color: #999;">相關操作涉及到用戶信息，請登錄后再試</text>
			</view>
			<view class="btn">
				<!-- <button open-type="getPhoneNumber" @getphonenumber="getPhoneNumber" class="left-btn" size="mini" type="default"></button> -->
				<button @click.stop="goRegister" class="left-btn" type="default" size="mini">开户</button>
				<button @click.stop="goLogin" class="right-btn" size="mini" type="default">登录</button>
			</view>
		</view>
	</view>
</template>

<script>
import { mapMutations } from 'vuex';
export default {
	data() {
		return {
			code: '',
			areaId: '1',
			// 加密数据
			encryptedData: '',
			iv: '',
			rawData: '',
			signature: ''
		};
	},
	methods: {
		...mapMutations(['login']),

		goRegister() {
			console.log('getuserinfo', !uni.getStorageSync('userInfo'));
			if (!uni.getStorageSync('userInfo')) {
				uni.getUserProfile({
					desc: '獲取您的昵稱、頭像、地區及性別',
					success: infoRes => {
						console.log('userInfo-res', infoRes);
						if (infoRes.errMsg === 'getUserProfile:ok') {
							uni.setStorageSync('encryptedData', infoRes.encryptedData);
							uni.setStorageSync('iv', infoRes.iv);
							uni.setStorageSync('signature', infoRes.signature);
							this.login(infoRes.userInfo);
							uni.navigateTo({
								url: '/platforms/mp-weixin/register/registerVersion'
							});
						} else {
							uni.showToast({
								title: '授權失敗',
								icon: 'error'
							});
						}
					},
					fail: err => {
						console.log('userInfo-err', JSON.stringify(err));
					}
				});
			} else {
				console.log('uni.navigateTo');
				uni.navigateTo({
					url: '/platforms/mp-weixin/register/registerVersion'
				});
			}
		},
		goLogin() {
			if (!uni.getStorageSync('userInfo')) {
				uni.getUserProfile({
					desc: '獲取您的昵稱、頭像、地區及性別',
					success: infoRes => {
						console.log('userInfo-res', infoRes);
						if (infoRes.errMsg === 'getUserProfile:ok') {
							uni.setStorageSync('encryptedData', infoRes.encryptedData);
							uni.setStorageSync('iv', infoRes.iv);
							uni.setStorageSync('rawData', infoRes.rawData);
							uni.setStorageSync('signature', infoRes.signature);
							this.login(infoRes.userInfo);
							uni.navigateTo({
								url: '/platforms/mp-weixin/register/registerVersion'
							});
						} else {
							uni.showToast({
								title: '授權失敗',
								icon: 'error'
							});
						}
					},
					fail: err => {
						console.log('userInfo-err', JSON.stringify(err));
					}
				});
			} else {
				uni.navigateTo({
					url: '/platforms/mp-weixin/register/registerVersion'
				});
			}
		},

		hidenLoginPopup() {
			this.$store.state.hasLogin = 1;
		}
	}
};
</script>

<style lang="scss">
</style>

这个不是很完善，只是基本用法，我这个菜鸡还在研究中。。。。完善了回头就来修改

标签：setStorageSync,微信,app,console,state,userInfo,infoRes,uni
来源： https://blog.csdn.net/weixin_56650035/article/details/119058328

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。