点击页面触发登录验证跳转登录页,登录之后返回当前页或者要跳转到某一页

今天给大家分享的是我在开发小程序的时候所用到的功能,功能原型是这样的:在登录之前该用户进入该小程序页面是可以看见主页以及个人信息页,但是需要操作某功能的时候要判断该用户是否登录状态,没有登陆的话就要跳转到登录页,在登录之后再跳回到当前页或者跳转到你想要跳转到的那一页。

那么在上代码之前需要先了解几种跳转方式

 

 

 

 

详情官网:https://uniapp.dcloud.net.cn/api/router.html#navigateto

然后上代码,这段代码放到 js 文件中,需要引用就在你要引用的vue文件中 import { } from ‘@/xxxxxx . js’ 就可以

// 拿到需要返回的页面路径和参数并保存 (跳转之前调用此方法)
export function setCallbackUrl(mode,urls) {
    return new Promise((resolve,reject) => {
        let pages = getCurrentPages(); //获取历史页面记录
        let currentPage = pages[pages.length - 1]; //获取当前页面
        let urlPage = ''; 
        //let url = currentPage.route; //拿到当前页面url
		// console.log(url+'================')
		let url = urls
        let argumentsStr = '';
        let options = currentPage.options; //拿到参数对象
        for (let key in options) {
                let value = options[key];
                argumentsStr += key + '=' + value + '&';
        }
        if(argumentsStr) {
             argumentsStr = argumentsStr.substring(0, argumentsStr.length - 1);
             urlPage = url + '?' + argumentsStr;
        } else {
            urlPage = url;
        }
        let callbackObj = {
            callbackUrl: `/${urlPage}`,
            mode: mode || 'redirectTo'
        }
         wx.setStorageSync('callbackObj', JSON.stringify(callbackObj));
         resolve();
    })
}
//该方法不需要传参,跳转页面是跳转之前所在页面
export function noSetCallbackUrl(mode) {
    return new Promise((resolve,reject) => {
        let pages = getCurrentPages(); //获取历史页面记录
        let currentPage = pages[pages.length - 1]; //获取当前页面
        let urlPage = ''; 
        let url = currentPage.route; //拿到当前页面url
		// console.log(url+'================')
		// let url = urls
        let argumentsStr = '';
        let options = currentPage.options; //拿到参数对象
        for (let key in options) {
                let value = options[key];
                argumentsStr += key + '=' + value + '&';
        }
        if(argumentsStr) {
             argumentsStr = argumentsStr.substring(0, argumentsStr.length - 1);
             urlPage = url + '?' + argumentsStr;
        } else {
            urlPage = url;
        }
        let callbackObj = {
            callbackUrl: `/${urlPage}`,
            mode: mode || 'switchTab'
        }
         wx.setStorageSync('callbackObj', JSON.stringify(callbackObj));
         resolve();
    })
}

// 提取本地存储的要返回的页面地址和参数,并返回之前的页面(登录完成后调用此方法)
export function getCallBackUrl() {
    return new Promise((resolve,reject) => {
        const callbackObj = wx.getStorageSync('callbackObj');
        if(callbackObj) {
            let resultObj = JSON.parse(callbackObj);
            let callbackUrl = resultObj.callbackUrl;
            let mode = resultObj.mode;
            mode == 'redirectTo' && wx.redirectTo({url: callbackUrl});
            mode == 'switchTab' && wx.switchTab({url: callbackUrl});
            mode == 'reLaunch' && wx.reLaunch({url: callbackUrl});
            mode == 'navigateTo' && wx.navigateTo({url: callbackUrl});
        } else {
            reject();
        }
    })
}

下面是引用的方法

import {setCallbackUrl} from '@/common/common_utils.js'
import {getCallBackUrl} from '@/common/common_utils.js'
import {noSetCallbackUrl} from '@/common/common_utils.js'

//需要自己定义跳转到那页的路径
this.$tab.navigateTo("/pages/XXXXX")
//urls是你在登录之后要跳转的路径
let urls ='pages/XXXXX'
let mode;
setCallbackUrl(mode,urls)

//如果你在登陆后不需要跳转其他页,只是跳回当前页
noSetCallbackUrl()




//在登录回调成功之后直接调用该方法即可,页面自动跳转
getCallBackUrl()

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值