uni-app常用的几种页面跳转方式总结
作者:丿TK丶灬丨爱悦 发布时间:2023-08-23 20:31:26
标签:uni-app,页面,跳转
一、uni.navigateTo(OBJECT)
保留当前页面,跳转到应用内的某个页面,使用uni.navigateBack
可以返回到原页面
uni.navigateTo(OBJECT) | uni-app官网 (dcloud.io)
methods: {
//gonavigate()为点击响应事件,可在HTML部分设置 @tap="gonavigate()"
gonavigate(){
uni.navigateTo({
//保留当前页面,跳转到应用内的某个页面
url: '/pages/detail/detail'
})
}
}
二、uni.navigateBack(OBJECT)
关闭当前页面,返回上一页面或多级页面。可通过 getCurrentPages()
获取当前的页面栈,决定需要返回几层。
uni.navigateTo(OBJECT) | uni-app官网 (dcloud.io)
methods: {
//goBack()为点击响应事件,可在HTML部分设置 @tap="goBack()"
goBack(){
uni.navigateBack({
//关闭当前页面,返回上一页面或多级页面。
delta:1
});
}
}
三、uni.redirectTo(OBJECT)
关闭当前页面,跳转到应用内的某个页面。
uni.navigateTo(OBJECT) | uni-app官网 (dcloud.io)
methods: {
//goregirect()为点击响应事件,可在HTML部分设置 @tap="goregirect()"
goregirect(){
uni.redirectTo({
//关闭当前页面,跳转到应用内的某个页面。
url:'/pages/about/about'
});
}
}
四、uni.switchTab(BOJECT)
跳转到 tabBar 页面,并关闭其他所有非 tabBar 页面。
uni.navigateTo(OBJECT) | uni-app官网 (dcloud.io)
methods: {
checklogin(){
uni.request({
url: 'http://localhost:8081/api/user/login',
data: {
email: this.emailone,
password: this.password,
},
success: (res) => {
//登录成功
if (res.data.success == true) {
uni.showToast({
title: '登录成功', //显示的文字
icon: 'success' //显示的图标
});
//跳转到 tabBar 页面,并关闭其他所有非 tabBar 页面。
uni.switchTab({
url: '../tabbor/index/index'
});
} else {
uni.showToast({
title: '用户名或密码错误', //显示的文字
icon: 'none' //显示的图标
});
}
}
})
}
}
五、openURL
调用第三方程序打开指定的URL
HTML5+ API Reference (html5plus.org)
methods: {
//goopenurl()为点击响应事件,可在HTML部分设置 @tap="goopenurl()"
goopenurl(){
boid plus.runtime.openURL('https://www.baidu.com/')
}
}
补充:传值与接收
通过跳转传值一般套路就是在URL中把需要传的值带过去,然后再接收的页面onLoad函数中,利用参数接回来。
跳转页面:
uni.navigateTo({
url:'页面路径?id=1'
})
接收页面:
onLoad: function (option) { //option为object类型,会序列化上个页面传递的参数
console.log(option.id);
//打印出上个页面传递的参数。传递的是id=1,则获取到的就是option.id
}
来源:https://blog.csdn.net/qq_53966033/article/details/124538656


猜你喜欢
- 前言今天在 git.oschina 的首页上看到他们推出演示平台,其中,Python 的演示平台支持 WSGI 接口的应用。虽然,这个演示平
- requests相比urllib,第三方库requests更加简单人性化,是爬虫工作中常用的库requests安装初级爬虫的开始主要是使用r
- 前言字典为动词“to yield”给出了两个释义:产出和让步。对于 Python 生成器中的 yie
- 将Timestamp转为datetime类型在Pandas中我们在处理时间序列的时候常用的方法有:pd.to_datetime()pd.da
- 本文实例讲述了django框架模板中定义变量的方法。分享给大家供大家参考,具体如下:总有一些情况,你会想在django template中设
- 顺序执行顺序执行是我们比较熟悉的工作模式,类似俗称流水账编程。所有不含分支、循环和goto语言,并且每一递归调用的Go函数一般都是顺序执行的
- <title></title> <script src="js/jquery-1.7.2
- 一、前言今天在这边专门整理了一遍文章,和大家一起聊聊如何使用python做PC端自动化!二、环境安装使用python实现来做PC端自动化,前
- 针对这种情况,人工智能自动SQL优化工具应运而生。现在我就向大家介绍这样一款工具:SQLTuning for SQL Server。1. S
- 这篇文章主要介绍了python操作openpyxl导出Excel 设置单元格格式及合并处理代码实例,文中通过示例代码介绍的非常详细,对大家的
- python列表元素去重后如何保持原来的顺序不变原列表:list1 = [1,2,1,4,9,3,5,2,6,7,3,1,6,8,4,0]去
- 安装laravel框架命令行cd进入指定目录下,执行composer create-project --prefer-dist larave
- 获得list中最大元素的索引aa = [1,2,3,4,5]aa.index(max(aa)) 相应的最小值使用aa = [1,2,3,4,
- 数字运算=:用于给变量赋值type(x):查看数据所属类型isinstance(x, A_tuple):判断数据是否为预期类型+:两个数相加
- 引言故事从好多年前说起。想必大家也听说过数据库单表建议最大2kw条数据这个说法。如果超过了,性能就会下降得比较厉害。巧了。我也听说过。但我不
- 通信信息包是发送至MySQL服务器的单个SQL语句,或发送至客户端的单一行。在MySQL 5.1服务器和客户端之间最大能发送的可能信息包为1
- 一空间多域名绑定3种方法,HTML代码格式:<html> <script language=javascript
- 这篇文章主要介绍了Python统计时间内的并发数代码实例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的
- 1.urlopen()方法urllib.urlopen(url[, data[, proxies]]) :创建一个表示远程url的类文件对象
- <html> 题:<br /> 有n个直线最多可以把一个平面分成多少个部分<br /><br /&