uni-app多个账号切换登录

一、缓存用户信息

1. 用户登录成功后缓存下用户的账号,token等一些能识别出用户的信息

2.缓存用户信息的时候最好以数组对象的形式缓存, 这样可以一次记录多个账户

    //登录接口 这里是我随便找的一个项目的登录接口 , 仅供参考
            login(){
                if(this.loadStatus){
                    return
                }
                if(!this.yueduCheck){
                    uni.showToast({
                        title: '请阅读并同意相关协议',
                        icon:'none',
                        duration: 2000
                    }); 
                    return
                }
                this.loadStatus = true;
                uni.request({
                    url: this.baseUrl+'user/login',
                    method: 'POST',
                    header: {
                            'sign': this.sign,
                            'timestamp':this.timestamp
                    },
                    data: {
                        'name':this.mobile,
                        'password':this.password,
                        'mobile':this.mobile
                    },
                    success: res => {
                        if(res.data.code==0){
                            try {
                                let infoArr = []//缓存所有账户信息的数组
                                if(uni.getStorageSync('infoArr')){
                                    infoArr = JSON.parse(uni.getStorageSync('infoArr'));
                                }
                                let userInfo = {}当前登录账户的信息
                                userInfo.mobile = res.data.data.mobile
                                userInfo.picUrl = res.data.data.avatar
                                userInfo.access_token = res.data.data.access_token
                                infoArr.push(userInfo)
                                let deWeightThree = () => {
                                    let map = new Map();
                                    for (let item of infoArr) {
                                        if (!map.has(item.mobile)) {
                                            map.set(item.mobile, item);
                                        }
                                    }
                                    return [...map.values()];
                                }
                                infoArr = deWeightThree();
                                uni.setStorageSync("infoArr",JSON.stringify(infoArr));//缓存前要把数据转换成字符串 本地存储不支持直接存储数组对象
                                uni.setStorageSync('access_token', res.data.data.access_token);
                            } catch (e) {
                                //console.log(e)
                            }
                            uni.switchTab({
                                url: '/pages/index/index'
                            });
                        }else{
                           uni.showToast({
                               title: res.data.message,
                               icon:'none',
                               duration: 2000
                           });  
                        }
                        this.loadStatus = false
                    },
                    fail: () => {},
                    complete: () => {}
                });
            }

二、读取缓存账户信息用来切换账户

以列表的形式把从缓存中读取出来的所有账户信息展示出来

    
            
                 
                     
                 
                 
                     
                 
                 当前账号
            
            
                +添加或者注册账号
            
        
      //获取当前登录用户信息
        uni.request({
            url: this.baseUrl + 'user/info',
            method: 'GET',
            header: {
                'sign': this.sign,
                'timestamp': this.timestamp,
                'Authorization': 'bearer ' + this.access_token
            },
            data: {},
            success: res => {
                if (res.data.code == 0) {
                    this.logShow = true
                    this.name = res.data.data.name
                    this.userNum = res.data.data.mobile
                    this.picUrl  =  res.data.data.avatar
                   //从缓存中取出缓存的所有账号, 对比当前登录的账户 , 设置成当前登录账户
                    this.infoArr = JSON.parse(uni.getStorageSync('infoArr'));
                    this.infoArr.map((item,index)=>{
                        if(this.infoArr[index].mobile==res.data.data.mobile){
                            this.$set(this.infoArr[index],'isCurrent',true)
                        }else{
                            this.$set(this.infoArr[index],'isCurrent',false)
                        }
                    })
                    this.$forceUpdate();
                }
                if(res.data.code == 10003){
                    this.logShow = false
                }   
            },
            fail: () => {},
            complete: () => {}
        });

三、切换账号登录

用当前账户的token把之前缓存起来用于请求接口的token替换掉,以此来达到切换账户登录的功能

//切换登录账户
        replaceInfo(info){
            console.log('当前账户',info)
            this.infoArr.map((item,index)=>{
                if(this.infoArr[index].mobile==info.mobile){
                    this.$set(this.infoArr[index],'isCurrent',true)
                    uni.setStorageSync('access_token', info.access_token);
                }else{
                    this.$set(this.infoArr[index],'isCurrent',false)
                }
            })
            this.$forceUpdate();
        }