我这个小白主要用的是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>

 

 

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