微信小程序页面跳转方法汇总
微信小程序前端页面跳转有多种方式,汇总如下:
Tips:
小程序前端的页面跳转之后,跳转之前的页面并不会凭空消失,而是存进了一个类似“页面栈”的空间里;
只有当这个所谓的“页面栈”满了之后页面才会退出栈(遵循队列先进先出规则)
一、JS跳转方式
①navigateTo
wx.navigateTo({
url: '/pages/good/index/index?id=1',
success:function(){},
fail:function(){},
complete:function(){}
})
路径限制规则:应用内非 tabBar 的页面的路径
②navigateBack
wx.navigateBack({
delta:
})
参数说明:delta参数是指回跳到页面栈的倒数第n个页面,如果页面栈页面数量少于该参数,那么返回首页
③redirectTo
wx.redirectTo({
url: '/pages/good/index/index?id=1',
success:function(){},
fail:function(){},
complete:function(){}
})
路径限制规则:应用内非 tabBar 的页面的路径
④switchTab
wx.switchTab({
url: '/pages/index/index',
success:function(){},
fail:function(){},
complete:function(){}
})
路径限制规则:应用内 tabBar 的页面(需在 app.json 的tabBar字段定义的页面)的路径,并关闭其他非tabBar页面
⑤reLaunch
wx.reLaunch({
url: '/pages/good/index/index?id=1',
success:function(){},
fail:function(){},
complete:function(){}
})
路径限制规则:应用内任意页面的路径
二、WXML方式跳转
wxml页面实现页面跳转有一个标签<navigator url="xxx" open-type="xxx">点击跳转</navigator>
这里是根据open-type的值来定义跳转的方式的:
①navigate
默认值,对应wx.navigateTo跳转方式或 wx.navigateToMiniProgram跳转方式
②navigateBack
对应wx.navigateBack跳转方式
③redirect
对应wx.redirectTo跳转方式
④switchTab
对应wx.switchTab跳转方式
⑤reLaunch
对应wx.reLaunch跳转方式
⑥exit
退出小程序,当target="miniProgram"时生效
微信小程序页面跳转方法汇总的更多相关文章
- 微信小程序页面跳转方法总结
微信小程序页面跳转目前有以下方法(不全面的欢迎补充): 1. 利用小程序提供的 API 跳转: // 保留当前页面,跳转到应用内的某个页面,使用wx.navigateBack可以返回到原页面.// 注 ...
- 微信小程序页面跳转方法和携带参数详解
1.页面跳转方式 (1)标签跳转 open-type的属性值对应api里的用法即wx.的用法 1 <navigator url="/page/navigate/navi ...
- 微信小程序-页面跳转与参数传递
QQ讨论群:785071190 微信小程序页面跳转方式有很多种,可以像HTML中a标签一样添加标签进行跳转,也可以通过js中方法进行跳转. navigator标签跳转 <view class=& ...
- 微信小程序——页面跳转及传参
小程序页面跳转 微信小程序的页面跳转依然是以传统的请求转发和请求重定向为主,tabbar的存在,有TAB页面的跳转. 为了微信小程序的简介方便,规定页面路径只能是十层,应尽量避免过多的交互方式. 1. ...
- 微信小程序页面跳转导航wx.navigateTo和wx.redirectTo
}) wx.redirectTo(OBJECT) 关闭当前页面,跳转到应用内的某个页面. 还是用上面的三张图示作为例子,当使用wx.redirctTo接口跳转页面时,原来的页面将被删除掉,当然,这是小 ...
- 微信小程序页面跳转 的几种方式
最近在做微信小程序,碰到页面跳转的问题,总结一下页面之间跳转的方式 一.wx.navigateTo(OBJECT) 这是最普遍的一种跳转方式,其官方解释为:“保留当前页面,跳转到应用内的某个页面” 类 ...
- 直击--vue项目微信小程序页面跳转web-view不刷新-根源
背景 最近项目需要适配小程序,项目是使用了vue开发的网站,其中改造方式是,每个页面都使用小程序创建一个页面通过web-view来显示指定页面的. 在没有使用小程序时,路由跳转时,刷新页面等等,这个是 ...
- 微信小程序页面跳转的三种方式总结
原文链接 https://blog.csdn.net/zgmu/article/details/72123329 首先我们了解到,小程序规定页面路径只能有五层,所以我们尽量避免多层级的页面跳转 页面跳 ...
- 微信小程序页面跳转后js定时器没有销毁的问题
现在有一个小程序,对页面数据的实时性很强,本来想用socket,仔细研究了一下,万剑不离其中,它是websocket.服务端不会用,所以使用了传统的http请求方式.开发微信小程序必须要知道的事 1. ...
随机推荐
- oppo R9 WLAN使用代理图解
以上拼图便是oppo R9 WLAN使用代理图解,代理设为 '手动' ,主机名便是我的电脑的ip地址,端口号是9973: + 9973端口号 (微信web开发者工具不可更改): + 8888 端口号 ...
- HandyJSON第三方库的日常使用与错误记录
一.错误提示 1.更新Xcode10.2,Swift5.0出现错误提示 Undefined symbols for architecture x86_64: "_swift_getField ...
- CSS 属性的推荐书写顺序
- RMI远程方法调用
RMI远程方法调用:适用于 客户端 调用 服务器 内的方法:(Kotlin 语言编写) 如果业务为二个服务器之间的通信,还是得用消息队列的形式,因为RMI 不适合 双向 调用 下面介绍RMI 的使用方 ...
- Python学习札记(十五) 高级特性1 切片
参考: 高级特性 切片 Note 1.掌握了Python的基础语法之后,就可以写出很多很有用的程序了,比如打印1-90的奇数: #!/usr/bin/env python3 L = [] n = 1 ...
- 04_MySQL常见函数_单行函数
#单行函数细分1.字符函数2.数学函数3.日期函数4.其他函数5.流程控制函数 #单行函数 - 字符函数#一.字符函数#1. length 获取参数的字节长度SELECT LENGTH('john') ...
- java 集合操作小结
Map<String,String> m1=new HashMap<String,String>(); m1.put("zara", "name1 ...
- ”由于没有远程桌面授权服务器可以提供许可证,远程会话被中断“的解决方案
由于windows server 2012 R2 Datacenter 安装了 远程桌面角色,但是这个角色是120天免费的,需要购买授权的. 解决方案: 删除这个角色,就可以正常进行远程桌面连接了.但 ...
- UIAutomation学习入门
一.界面的自动化操作 .Ui自动化测试 .软件外挂 二.Win32基础知识 a.Win32中一切元素皆窗口,窗口之间有父子关系.整个桌面是一个“根窗口”. b.进程: 根据进程id拿到进程对象Proc ...
- photoshop cc下载与安装
地址:https://jingyan.baidu.com/article/c275f6bacdd927e33d756729.html