当前位置: 首页 > news >正文

微信小程序中常见的 跳转方式 及其特点的表格总结(wx.navigateTo 适合需要返回上一页的场景)

文章目录

      • 详细说明
      • 总结
      • `wx.navigateTo` 的特点
      • 为什么 `wx.navigateTo` 最常用?
      • 其他跳转方式的使用频率
      • 总结

以下是微信小程序中常见的跳转方式及其特点的表格总结:

跳转方式API 方法特点适用场景
wx.navigateTowx.navigateTo({ url: '路径' })保留当前页面,跳转到新页面(非 tabBar 页面)。最多支持 10 层页面栈。用于跳转到非 tabBar 页面,且需要返回上一页的场景。
wx.redirectTowx.redirectTo({ url: '路径' })关闭当前页面,跳转到新页面(非 tabBar 页面)。用于不需要返回当前页面的场景,如登录后跳转到主页。
wx.switchTabwx.switchTab({ url: '路径' })跳转到 tabBar 页面,并关闭其他所有非 tabBar 页面。用于切换到 tabBar 页面的场景。
wx.reLaunchwx.reLaunch({ url: '路径' })关闭所有页面,跳转到新页面(可以是 tabBar 或非 tabBar 页面)。用于重置应用状态并跳转到新页面的场景,如退出登录后跳转到登录页。
wx.navigateBackwx.navigateBack({ delta: 1 })返回上一页面或多层页面,delta 参数指定返回的层数。用于返回上一页或多层页面的场景。
wx.navigateToMiniProgramwx.navigateToMiniProgram({ appId: '目标小程序appId' })跳转到其他小程序。用于跳转到其他小程序的场景。
wx.navigateBackMiniProgramwx.navigateBackMiniProgram()从其他小程序返回到当前小程序。用于从其他小程序返回当前小程序的场景。

详细说明

  1. wx.navigateTo

    • 特点:保留当前页面,跳转到新页面。
    • 限制:最多只能打开 10 层页面栈。
    • 示例
      wx.navigateTo({url: '/pages/detail/detail?id=123'
      });
      
  2. wx.redirectTo

    • 特点:关闭当前页面,跳转到新页面。
    • 限制:不能跳转到 tabBar 页面。
    • 示例
      wx.redirectTo({url: '/pages/index/index'
      });
      
  3. wx.switchTab

    • 特点:跳转到 tabBar 页面,并关闭其他非 tabBar 页面。
    • 限制:只能跳转到 tabBar 页面。
    • 示例
      wx.switchTab({url: '/pages/home/home'
      });
      
  4. wx.reLaunch

    • 特点:关闭所有页面,跳转到新页面。
    • 限制:无。
    • 示例
      wx.reLaunch({url: '/pages/login/login'
      });
      
  5. wx.navigateBack

    • 特点:返回上一页面或多层页面。
    • 参数delta 指定返回的层数,默认为 1。
    • 示例
      wx.navigateBack({delta: 1 // 返回上一页
      });
      
  6. wx.navigateToMiniProgram

    • 特点:跳转到其他小程序。
    • 限制:需要目标小程序的 appId,且需要用户授权。
    • 示例
      wx.navigateToMiniProgram({appId: '目标小程序的appId',path: '目标小程序的路径'
      });
      
  7. wx.navigateBackMiniProgram

    • 特点:从其他小程序返回到当前小程序。
    • 示例
      wx.navigateBackMiniProgram();
      

总结

微信小程序提供了多种跳转方式,适用于不同的场景:

  • 页面内跳转wx.navigateTowx.redirectTowx.reLaunch
  • tabBar 跳转wx.switchTab
  • 返回上一页wx.navigateBack
  • 跳转到其他小程序wx.navigateToMiniProgramwx.navigateBackMiniProgram

根据具体需求选择合适的跳转方式,可以提升用户体验和开发效率。


在微信小程序开发中,wx.navigateTo 是使用最频繁的跳转方式。以下是它的特点和使用场景,以及为什么它是最常用的:


wx.navigateTo 的特点

  1. 保留当前页面

    • 跳转到新页面时,当前页面会被保留在页面栈中,用户可以通过返回按钮回到上一页。
    • 适合需要返回上一页的场景。
  2. 支持传递参数

    • 可以通过 URL 传递参数到目标页面,例如:
      wx.navigateTo({url: '/pages/detail/detail?id=123&name=foo'
      });
      
    • 目标页面可以通过 onLoad 生命周期函数接收参数:
      Page({onLoad(query) {console.log(query.id); // 输出 123console.log(query.name); // 输出 foo}
      });
      
  3. 适用于非 tabBar 页面

    • wx.navigateTo 只能跳转到非 tabBar 页面,而 tabBar 页面通常使用 wx.switchTab
  4. 页面栈限制

    • 最多只能打开 10 层页面栈。如果超过 10 层,需要先关闭一些页面。

为什么 wx.navigateTo 最常用?

  1. 符合用户习惯

    • 用户通常期望通过返回按钮回到上一页,而 wx.navigateTo 正好满足这一需求。
  2. 灵活性高

    • 支持传递参数,适合大多数页面跳转场景。
    • 可以跳转到任意非 tabBar 页面。
  3. 开发便捷

    • 代码简单易用,适合快速开发。
  4. 适用场景广泛

    • 例如:
      • 从列表页跳转到详情页。
      • 从表单页跳转到确认页。
      • 从主页跳转到设置页。

其他跳转方式的使用频率

  1. wx.redirectTo

    • 使用频率较低,通常用于不需要返回当前页面的场景,例如登录后跳转到主页。
  2. wx.switchTab

    • 用于跳转到 tabBar 页面,使用频率中等。
  3. wx.reLaunch

    • 使用频率较低,通常用于重置应用状态,例如退出登录后跳转到登录页。
  4. wx.navigateBack

    • 使用频率较高,通常用于返回上一页或多层页面。
  5. wx.navigateToMiniProgram

    • 使用频率较低,通常用于跳转到其他小程序。

总结

  • wx.navigateTo 是最常用的跳转方式,因为它符合用户习惯、灵活性高且开发便捷。
  • 其他跳转方式(如 wx.switchTabwx.redirectTo 等)则根据具体场景选择使用。

在这里插入图片描述

相关文章:

微信小程序中常见的 跳转方式 及其特点的表格总结(wx.navigateTo 适合需要返回上一页的场景)

文章目录 详细说明总结wx.navigateTo 的特点为什么 wx.navigateTo 最常用?其他跳转方式的使用频率总结 以下是微信小程序中常见的跳转方式及其特点的表格总结: 跳转方式API 方法特点适用场景wx.navigateTowx.navigateTo({ url: 路径 })保留当前页面&…...

【Elasticsearch】index:false

在 Elasticsearch 中,index 参数用于控制是否对某个字段建立索引。当设置 index: false 时,意味着该字段不会被编入倒排索引中,因此不能直接用于搜索查询。然而,这并不意味着该字段完全不可访问或没有其他用途。以下是关于 index:…...

新版IDEA创建数据库表

这是老版本的IDEA创建数据库表,下面可以自己勾选Not null(非空),Auto inc(自增长),Unique(唯一标识)和Primary key(主键) 这是新版的IDEA创建数据库表,Not null和Auto inc可以看得到,但Unique和Primary key…...

输入带空格的字符串,求单词个数

输入带空格的字符串&#xff0c;求单词个数 __ueooe_eui_sjje__ ---->3syue__jdjd____die_ ---->3shuue__dju__kk ---->3 #include <stdio.h> #include <string.h>// 自定义函数来判断字符是否为空白字符 int isSpace(char c) {return c || c \t || …...

C语言程序设计十大排序—希尔排序

文章目录 1.概念✅2.希尔排序&#x1f388;3.代码实现✅3.1 直接写✨3.2 函数✨ 4.总结✅ 1.概念✅ 排序是数据处理的基本操作之一&#xff0c;每次算法竞赛都很多题目用到排序。排序算法是计算机科学中基础且常用的算法&#xff0c;排序后的数据更易于处理和查找。在计算机发展…...

Excel制作合同到期自动提醒!

大家好&#xff0c;我是小鱼。 今天分享一下如何利用Excel制作合同到期提醒表&#xff0c;实现Excel表格自动计算合同到期日和天数&#xff0c;根据合同状态和到期天数自动填充颜色提醒&#xff0c;超实用。先看一下效果&#xff0c;已经到期的合同会自动被填充为红色&#xf…...

“AI质量评估系统:智能守护,让品质无忧

嘿&#xff0c;各位小伙伴们&#xff01;今天咱们来聊聊一个在现代社会中越来越重要的角色——AI质量评估系统。你知道吗&#xff1f;在这个快速发展的时代&#xff0c;产品质量已经成为企业生存和发展的关键。而AI质量评估系统&#xff0c;就像是我们的智能守护神&#xff0c;…...

爬虫基础之爬取某基金网站+数据分析

声明: 本案例仅供学习参考使用&#xff0c;任何不法的活动均与本作者无关 网站:天天基金网(1234567.com.cn) --首批独立基金销售机构-- 东方财富网旗下基金平台! 本案例所需要的模块: 1.requests 2.re(内置) 3.pandas 4.pyecharts 其他均需要 pip install 模块名 爬取步骤: …...

使用 Aryn DocPrep、DocParse 和 Elasticsearch 向量数据库实现高质量 RAG

作者&#xff1a;来自 Elastic Hemant Malik 及 Jonathan Fritz 组织依靠自然语言查询从非结构化数据中获取见解&#xff0c;但要获得高质量的答案&#xff0c;首先要进行有效的数据准备。Aryn DocParse 和 DocPrep通过将复杂文档转换为结构化 JSON 或 markdown 来简化此过程&a…...

Couchbase UI: Server

在 Couchbase UI 中的 Server&#xff08;服务器&#xff09;标签页主要用于管理和监控集群中的各个节点。以下是 Server 标签页的主要内容和功能介绍&#xff1a; 1. 节点列表 显示集群中所有节点的列表&#xff0c;每个节点的详细信息包括&#xff1a; 节点地址&#xff1…...

Web3.0时代的挑战与机遇:以开源2+1链动模式AI智能名片S2B2C商城小程序为例的深度探讨

摘要&#xff1a;Web3.0作为互联网的下一代形态&#xff0c;承载着去中心化、开放性和安全性的重要愿景。然而&#xff0c;其高门槛、用户体验差等问题阻碍了Web3.0的主流化进程。本文旨在深入探讨Web3.0面临的挑战&#xff0c;并提出利用开源21链动模式、AI智能名片及S2B2C商城…...

langchain基础(一)

模型又可分为语言模型&#xff08;擅长文本补全&#xff0c;输入和输出都是字符串&#xff09;和聊天模型&#xff08;擅长对话&#xff0c;输入时消息列表&#xff0c;输出是一个消息&#xff09;两大类。 以调用openai的聊天模型为例&#xff0c;先安装langchain_openai库 1…...

【Android】布局文件layout.xml文件使用控件属性android:layout_weight使布局较为美观,以RadioButton为例

目录 说明举例 说明 简单来说&#xff0c;android:layout_weight为当前控件按比例分配剩余空间。且单个控件该属性的具体数值不重要&#xff0c;而是多个控件的属性值之比发挥作用&#xff0c;例如有2个控件&#xff0c;各自的android:layout_weight的值设为0.5和0.5&#xff0…...

RabbitMQ 架构分析

文章目录 前言一、RabbitMQ架构分析1、Broker2、Vhost3、Producer4、Messages5、Connections6、Channel7、Exchange7、Queue8、Consumer 二、消息路由机制1、Direct Exchange2、Topic Exchange3、Fanout Exchange4、Headers Exchange5、notice5.1、备用交换机&#xff08;Alter…...

Qt Enter和HoverEnter事件

介绍 做PC开发的过程中或多或少都会接触到鼠标的悬停事件&#xff0c;Qt中处理鼠标悬停有Enter和HoverEnter两种事件 相同点 QEvent::Enter对应QEnterEvent&#xff0c;描述的是鼠标进入控件坐标范围之内的行为&#xff0c;QEnterEvent可以抓取鼠标的位置&#xff1b;QEvent…...

大语言模型之prompt工程

前言 随着人工智能的快速发展&#xff0c;我们正慢慢进入AIGC的新时代&#xff0c;其中对自然语言的处理成为了智能化的关键一环&#xff0c;在这个大背景下&#xff0c;“Prompt工程”由此产生&#xff0c;并且正逐渐成为有力的工具... LLM &#xff08;Large Language Mode…...

WPF基础 | WPF 常用控件实战:Button、TextBox 等的基础应用

WPF基础 | WPF 常用控件实战&#xff1a;Button、TextBox 等的基础应用 一、前言二、Button 控件基础2.1 Button 的基本定义与显示2.2 按钮样式设置2.3 按钮大小与布局 三、Button 的交互功能3.1 点击事件处理3.2 鼠标悬停与离开效果3.3 按钮禁用与启用 四、TextBox 控件基础4.…...

[笔记] 极狐GitLab实例 : 手动备份步骤总结

官方备份文档 : 备份和恢复极狐GitLab 一. 要求 为了能够进行备份和恢复&#xff0c;请确保您系统已安装 Rsync。 如果您安装了极狐GitLab&#xff1a; 如果您使用 Omnibus 软件包&#xff0c;则无需额外操作。如果您使用源代码安装&#xff0c;您需要确定是否安装了 rsync。…...

随笔十七、eth0单网卡绑定双ip的问题

在调试语音对讲过程中遇到过一个“奇怪”问题&#xff1a;泰山派作为一端&#xff0c;可以收到对方发来的语音&#xff0c;而对方不能收到泰山派发出的语音。 用wireshark抓包UDP发现&#xff0c;泰山派发送的地址是192.168.1.30&#xff0c;而给泰山派实际设置的静态地址是19…...

逻辑复制parallel并发参数测试

逻辑复制parallel并发参数测试 一、测试结果、测试环境描述 1.1、测试结果 cpu表中有1000万条数据&#xff0c;大小为1652MB,当更新的数据量多于10万条的时候有明显变化&#xff0c;多余30万条的时候相差2倍。 更新的数据量较多时&#xff0c;逻辑复制使用并发参数相比于使用…...

Spring Boot项目实战:手把手教你配置Google Play订阅与Pub/Sub回调(含完整代码)

Spring Boot实战&#xff1a;构建高可靠Google Play订阅与Pub/Sub回调系统 在移动应用商业化路径中&#xff0c;应用内订阅已成为数字服务持续变现的核心模式。根据Statista数据&#xff0c;2023年全球应用订阅收入达到380亿美元&#xff0c;其中Google Play贡献了超过34%的份额…...

如何用Langchain来实现一个查询天气的AI智能体

上一篇&#xff0c;我们讲了如何用Langchain来搭建一个通义大语言模型应用。今天小编就来讲一讲如何用Langchain来实现一个查询天气的AI智能体。本文使用的大模型是智谱AI&#xff0c;采用Python代码来实现。我们需要先在官方网站申请一个开发的Key&#xff0c;在接下来的代码中…...

南北阁Nanbeige 4.1-3B Git版本控制实战:从入门到团队协作

南北阁Nanbeige 4.1-3B Git版本控制实战&#xff1a;从入门到团队协作 本文面向刚接触版本控制的开发者&#xff0c;手把手教你用南北阁Nanbeige 4.1-3B掌握Git核心技能&#xff0c;从基础命令到团队协作全流程。 1. 为什么你需要Git版本控制&#xff1f; 刚开始写代码时&…...

Wan2.1-umt5模型部署排错指南:解决403 Forbidden等常见API错误

Wan2.1-umt5模型部署排错指南&#xff1a;解决403 Forbidden等常见API错误 最近在折腾Wan2.1-umt5模型&#xff0c;想把它部署起来对外提供API服务&#xff0c;结果踩了不少坑。最让人头疼的就是各种HTTP错误码&#xff0c;比如403 Forbidden、502 Bad Gateway&#xff0c;有时…...

WeChatExporter:免费开源工具,轻松备份你的微信聊天记录到电脑

WeChatExporter&#xff1a;免费开源工具&#xff0c;轻松备份你的微信聊天记录到电脑 【免费下载链接】WeChatExporter 一个可以快速导出、查看你的微信聊天记录的工具 项目地址: https://gitcode.com/gh_mirrors/wec/WeChatExporter 你是否曾经担心过手机丢失、系统崩…...

RAGAS 0.2.4 + Ollama本地大模型:手把手教你生成高质量RAG测试数据集(含踩坑实录)

RAGAS 0.2.4与Ollama本地大模型实战&#xff1a;构建高可靠性RAG测试数据集的深度指南 当我们需要评估一个检索增强生成&#xff08;RAG&#xff09;系统的性能时&#xff0c;高质量的测试数据集是关键。然而&#xff0c;依赖云端大模型服务不仅成本高昂&#xff0c;还可能面临…...

终极zsh语法高亮插件版本兼容性测试:Zsh 5.0到5.9全面支持指南

终极zsh语法高亮插件版本兼容性测试&#xff1a;Zsh 5.0到5.9全面支持指南 【免费下载链接】zsh-syntax-highlighting Fish shell like syntax highlighting for Zsh. 项目地址: https://gitcode.com/gh_mirrors/zs/zsh-syntax-highlighting zsh-syntax-highlighting是Z…...

小白也能玩转AI绘画:LiuJuan20260223Zimage快速上手指南

小白也能玩转AI绘画&#xff1a;LiuJuan20260223Zimage快速上手指南 你是不是也刷到过那些用AI生成的、细节超棒的人像图片&#xff0c;心里痒痒的&#xff0c;但又觉得那些工具太复杂&#xff0c;光是安装部署就劝退了&#xff1f;别担心&#xff0c;今天要介绍的这个工具&am…...

Qwen3.5-4B-Claude-Opus零基础上手:Web交互页面功能详解与最佳实践

Qwen3.5-4B-Claude-Opus零基础上手&#xff1a;Web交互页面功能详解与最佳实践 1. 模型与平台介绍 Qwen3.5-4B-Claude-4.6-Opus-Reasoning-Distilled-GGUF 是一个基于 Qwen3.5-4B 的推理蒸馏模型&#xff0c;特别强化了结构化分析、分步骤回答、代码与逻辑类问题的处理能力。…...

TranslucentTB终极指南:如何彻底改造Windows任务栏的视觉体验

TranslucentTB终极指南&#xff1a;如何彻底改造Windows任务栏的视觉体验 【免费下载链接】TranslucentTB A lightweight utility that makes the Windows taskbar translucent/transparent. 项目地址: https://gitcode.com/gh_mirrors/tr/TranslucentTB 你是否厌倦了Wi…...