【边做边学】uni.switchTab的目标页面获取不到url携的参数

简介: 【边做边学】uni.switchTab的目标页面获取不到url携的参数

对于uni.switchTab切换到的页面,如果使用了类似于uni.switchTab({ url: '/pages/route/route?type=4' })这样的方式,携带参数的情况会遇到一些问题。uni.switchTab并不直接支持传递参数,而且 TabBar 页面在切换时可能无法正常获取到传递的参数。

一个常见的解决方案是使用全局状态管理(比如Vuex)或者小程序的全局数据(getApp().globalData)来在跳转前存储数据,然后在目标页面的onLoadonShow生命周期中获取这些数据。

在跳转前存储参数:

// 在当前页面的某个方法或事件中
uni.setStorageSync('targetPageParams', { type: 4 });
uni.switchTab({
  url: '/pages/route/route',
});

在目标页面的onLoadonShow中获取参数:

// 在目标页面的 page.js 文件中
 
export default {
  onLoad() {
    // 获取存储的参数
    const targetPageParams = uni.getStorageSync('targetPageParams');
    console.log('参数:', targetPageParams);
    
    // 清除参数(可选)
    uni.removeStorageSync('targetPageParams');
  },
  // 其他生命周期函数和配置项
};

这种方法通过全局存储数据的方式,可以在目标页面加载时获取到传递的参数。请注意在使用uni.setStorageSync时,如果需要,可以在目标页面加载后清除已经使用过的参数。

相关文章
|
1月前
|
存储 缓存 网络协议
计算机网络常见面试题(二):浏览器中输入URL返回页面过程、HTTP协议特点,GET、POST的区别,Cookie与Session
计算机网络常见面试题(二):浏览器中输入URL返回页面过程、HTTP协议特点、状态码、报文格式,GET、POST的区别,DNS的解析过程、数字证书、Cookie与Session,对称加密和非对称加密
|
1月前
|
域名解析 缓存 网络协议
浏览器中输入URL返回页面过程(超级详细)、DNS域名解析服务,TCP三次握手、四次挥手
浏览器中输入URL返回页面过程(超级详细)、DNS域名解析服务,TCP三次握手、四次挥手
|
4月前
|
网络协议 前端开发 JavaScript
浏览器加载网页的幕后之旅:从URL到页面展示详解
【8月更文挑战第31天】当在浏览器地址栏输入URL并回车后,一系列复杂过程随即启动,包括DNS解析、TCP连接建立、HTTP请求发送、服务器请求处理及响应返回,最后是浏览器页面渲染。这一流程涉及网络通信、服务器处理和客户端渲染等多个环节。通过示例代码,本文详细解释了每个步骤,帮助读者深入理解Web应用程序的工作机制,从而在开发过程中作出更优决策。
77 5
|
3月前
|
前端开发 JavaScript
前端JS截取url上的参数
文章介绍了两种前端JS获取URL参数的方法:手动截取封装和使用URLSearchParams。
61 0
|
4月前
|
缓存 前端开发 JavaScript
输入URL到页面渲染的全过程
输入URL到页面渲染的全过程
37 1
|
4月前
|
JavaScript Linux 应用服务中间件
【Azure 应用服务】FTP 部署 Vue 生成的静态文件至 Linux App Service 后,访问App Service URL依旧显示Azure默认页面问题
【Azure 应用服务】FTP 部署 Vue 生成的静态文件至 Linux App Service 后,访问App Service URL依旧显示Azure默认页面问题
|
4月前
|
API UED 开发者
Vaadin路由魔法:导航之舟,带你穿越页面迷宫!驾驭神奇URL,解锁无限可能!
【8月更文挑战第31天】Vaadin是一款现代Java Web开发框架,其路由机制结合前后端路由,确保流畅的用户体验和高效服务器资源利用。通过`@Route`注解和`Router`类,开发者可以轻松定义和管理页面路径。例如,`@Route("home")`可指定视图路径,而参数化路由如`@Route("user/:userId")`则允许URL传参。此外,Vaadin还提供了丰富的导航API和自定义路由事件监听器,助力开发者构建结构清晰且体验优秀的Web应用。
64 0
|
4月前
|
开发框架 前端开发 .NET
Asp.net Webapi 的 Post 方法不能把参数加到 URL 中?试试这样写
Asp.net Webapi 的 Post 方法不能把参数加到 URL 中?试试这样写
|
4月前
|
Java
JAVA 获取 URL 指定参数的值
JAVA 获取 URL 指定参数的值
53 0
|
4月前
|
缓存 网络协议 JavaScript
面试常考题:输入url到页面渲染发生了什么?(前半段)
面试常考题:输入url到页面渲染发生了什么?(前半段)