uniapp实现tabbar页面跳转前进行拦截

遇到的需求:进入小程序wxlogin请求成功后请求另外一个接口会获取一个字段值,根据这个值判断能否跳转到第二个tabaar页面并给出相应的提示.

使用uni.addInterceptor

uni.addInterceptor 一般是用于拦截api的方法
具体 https://uniapp.dcloud.io/api/interceptor?id=addinterceptor

跳转拦截

创建intercept.js

//拦截器 拦截judge值等于空的时候 想要跳转到白名单内的路径时,不能跳转并给出提示
import store from '@/store'
// 白名单页面名单  可以配置多个
const whiteList = ['/pages/life/index',
]
uni.addInterceptor('switchTab', {// tabbar页面跳转前进行拦截invoke(e) {var that=thisvar judge=that.vuex_user.judgeif ( !judge && e.url == whiteList[0]) {uni.showToast({title: '正在获取用户信息',icon: "none",duration: 1000});//     uni.switchTab({//       url: '/pages/home/home'//     });return false} else {return true}},success(e) {// console.log(e)},fail(err){// console.log(err)}
})

还有一个方法就是引入uni-simple-router 保留了 Vue-router 完全相似的书写风格
但是小程序系列无法拦截原生tabbar及原生导航返回，如需拦截请自定义tabbar、header
具体 https://hhyang.cn/src/router/start/introduction.html

uniapp实现tabbar页面跳转前进行拦截相关推荐

关于在页面跳转前alert()不能弹出消息的问题
按照正常的逻辑,先显示消息,再将页面跳转,实际上不新alert对话框不能显示 Response.Write("<script>alert('dsafasdf');</scr ...
笔记1：uni-app简单创建配置路径样式tabbar页面跳转
1,下载安装编辑器:https://www.dcloud.io/ 2,打开HBuilder,文件-新建-项目选择平台uni-app,填写项目名称,保存路径,选择模板,创建 3,选择平台不一样,模板选 ...
[Xcode 实际操作]九、实用进阶-(24)使用Segue(页面的跳转连接)进行页面跳转并传递参数...
目录:[Swift]Xcode实际操作本文将演示使用Segue(页面的跳转连接)进行页面跳转并传递参数. 参照结合:[Xcode10 实际操作]九.实用进阶-(23)多个Storyboard故事板中 ...
微信小程序系列3——页面跳转详解
前言首先,微信页面跳转的是一个页面栈进栈出栈的过程,也可以简单的理解对页面跳转的操作就是一个栈的操作. 微信小程序主要一下两类样式的跳转(JS.WXML控件): JS控制的跳转: navigat ...
微信小程序学习之五种页面跳转方法.
第一种:<navigator></navigator>标签. 这是最常见的一种跳转方式,相当于html里的a标签.但需要注意的是该方法不能跳转tabbar页面. 格式为: & ...
微信小程序uni.switchTab传参获取不到；小程序跳转到tabBar页并传参；uni-app微信小程序获取tabBar页面参数失败；uni-app微信小程序tabBar页面onLoad不执行
需求场景:从非tabBar页面B跳转到tabBar页面A,并想要携带参数. 如果使用uni.switchTab传参,会导致tabBAE页面获取不到参数: 原因: 官方文档有说,uni.switchTa ...
uni-app三种生命周期及页面跳转方法
uni-app三种生命周期应用生命周期应用生命周期函数: onLaunch:当uni-app初始化完成时触发(全局只触发一次) onShow:当uni-app启动,或从后台进入前台显示 onHid ...
视频直播网站源码，uniapp页面跳转的几种方法和区别
视频直播网站源码,uniapp页面跳转的几种方法和区别保留当前页面,可跳转到非 tabBar 页面,使用uni.navigateBack可以返回到原页面(可传参) uni.navigateTo({u ...
uni-app页面跳转以及传值
在uni-app中是没有路由这一说法的,想要跳转页面官方给出了以下几种方法: 一.通过配置pages.json里面的tabBar来实现,主要写法请参考官方文档: uni-app官方配置pages.js ...

uniapp实现tabbar页面跳转前进行拦截

遇到的需求:进入小程序wxlogin请求成功后请求另外一个接口会获取一个字段值,根据这个值判断能否跳转到第二个tabaar页面并给出相应的提示.

使用uni.addInterceptor

跳转拦截

uniapp实现tabbar页面跳转前进行拦截相关推荐

最新文章

热门文章