【愚公系列】《微信小程序与云开发从入门到实践》007-路由与模块化

愚公搬代码

已于 2024-11-10 11:06:32 修改

阅读量6.5w

点赞数 25

分类专栏：愚公系列-书籍专栏文章标签：微信小程序小程序

于 2024-08-30 23:03:07 首次发布

本文链接：https://blog.csdn.net/aa2528877987/article/details/141729393

版权

标题	详情
作者简介	愚公搬代码
头衔	华为云特约编辑，华为云云享专家，华为开发者专家，华为产品云测专家，CSDN博客专家，CSDN商业化专家，阿里云专家博主，阿里云签约作者，腾讯云优秀博主，腾讯云内容共创官，掘金优秀博主，亚马逊技领云博主，51CTO博客专家等。
近期荣誉	2022年度博客之星TOP2，2023年度博客之星TOP2，2022年华为云十佳博主，2023年华为云十佳博主等。
博客内容	.NET、Java、Python、Go、Node、前端、IOS、Android、鸿蒙、Linux、物联网、网络安全、大数据、人工智能、U3D游戏、小程序等相关领域知识。
欢迎	👍点赞、✍评论、⭐收藏

🚀前言

在当今的移动应用开发中，微信小程序以其轻量化和便捷的特点，受到了越来越多开发者的青睐。而在构建复杂的小程序时，路由管理和模块化设计显得尤为重要。良好的路由设计可以帮助用户实现流畅的页面导航，而模块化则有助于提升代码的可读性和可维护性，促进团队协作。

本篇文章将深入探讨微信小程序中的路由机制与模块化开发的最佳实践。我们将从基础概念入手，逐步解析如何有效地配置路由、管理页面间的跳转，以及如何将代码拆分成独立模块，提高项目的灵活性和扩展性。无论你是小程序开发的新手，还是希望提升开发效率的资深工程师，这篇文章都将为你提供实用的指导和启发。

让我们一起探索微信小程序的路由与模块化，打造更高效、更优雅的应用吧！

一般一个完整的小程序应用都会由许多个页面组成，而在小程序中所有的页面都是由路由架构进行统一管理，本节我们来介绍路由和模块的概念和开发方法。

小程序中的页面采用栈结构的方式进行管理。页面切换时，不同的路由方式会对路由栈产生不同的影响：

启动时：
- 配置的首页会最先入栈。
页面跳转 (wx.navigateTo)：
- 新页面会入栈，并且放置在栈顶，之前的页面依然保持在栈中。
页面重定向 (wx.redirectTo)：
- 当前页面会出栈，重定向后的页面会入栈。
页面返回 (wx.navigateBack)：
- 当前页面会出栈，如果指定返回到某个页面，则此页面上的所有页面都会依次出栈。
标签页切换 (wx.switchTab)：
- 标签页切换是一种特殊场景，可以将标签页理解为最底层的平级页面。当发生标签页切换操作时，栈中的所有页面都会出栈，只留下要切换到的标签页。
重启动 (wx.reLaunch)：
- 重启时，栈中的全部页面都会出栈，并重新入栈配置的首页。

页面跳转示例

在 HelloWorld 项目的 index.js 文件中，可以看到如下定义的方法：

// 事件处理函数
bindViewTap() {
   
  wx.navigateTo({
   
    url: '../logs/logs' // 进行页面跳转
  });
}

此方法是绑定在页面头像上的逻辑处理函数，其中 wx.navigateTo 方法用于进行页面跳转。调用此方法时，可以传递一个参数对象，此对象中可配置的选项如下：

配置项	类型	作用
`url`	字符串	需要跳转的页面路径，如果有参数需要传递，参数和路径间要以问号进行分割，与网页 URL 规则类似