一、小程序跳转方式

1、wx.switchTab(Object object)

跳转到 tabBar 页面，并关闭其他所有非 tabBar 页面

需要跳转的 tabBar 页面的路径 (代码包路径)（需在 app.json 的 tabBar 字段定义的页面），路径后不能带参数。

使用备注：由于 tabBar 在切换器需要获取收取及是否登录的判断，故当前小程序的 tabBar 是自定义组件，该跳转无效

只有该方法的 url 参数，不能进行拼接，必须跟 tabBar 配置的路由一模一样；wx.navigateBack 没有 url 参数

2、wx.reLaunch(Object object)

关闭所有页面，打开到应用内的某个页面

3、wx.redirectTo(Object object)

关闭当前页面，跳转到应用内的某个页面。但是不允许跳转到 tabbar 页面。

导航样式： 如果当前只有一个路由层级，导航 header 左侧会默认显示可以进入“首页”的图标

4、wx.navigateTo(Object object)

保留当前页面，跳转到应用内的某个页面。但是不能跳到 tabbar 页面。使用 wx.navigateBack 可以返回到原页面。小程序中页面栈最多十层。

events 用于监听被打开页面发送到当前页面的数据。

导航样式：导航 header 左侧会默认显示“返回”的图标

5、wx.navigateBack(Object object)

关闭当前页面，返回上一页面或多级页面。可通过 getCurrentPages 获取当前的页面栈，决定需要返回几层。

通过参数 delta 设置返回的页面数，如果 delta 大于现有页面数，则返回到首页。默认值为 1

二、二货集小程序路由分析

1、目前所有 pages——总计 10 个

存在潜在路由层级超过 10 个风险

当路由层级达到 10 个时，wx.navigateTo 将无法打开新页面

'pages/index/index',
'pages/publish/index',
'pages/detail/index',
'pages/search/index',
'pages/profile/index',
'pages/profile/contact/index',
'pages/profile/contact/add/index',
'pages/profile/edit/index',
'pages/profile/feedback',
'pages/myProductList/index',

2、路由跳转方式使用现状

2.1、wx.redirectTo 的使用

使用条件

• 不需要返回到当前页面时
• 同时，其他页面仍需要返回显示时

使用效果

• 关闭当前页面，同时打开一个新页面，即便新页面还在路由栈里
  • 在新页面不会返回到当前页面
• 路由栈层级级数不变
  • 跟在当前页的路由栈层级比较起来，层级不变
  • 跟进入该页面之前比起来，路由栈层级增加 1
  • 如果反复进入该当前页面，则会导致路由层级不断增加
  • 需要谨慎使用

使用页面

• 发布页面，在新建状态下，提交成功后，进入“该商品详情页”
  • 从发布页接入详情页，不需要再次返回进入发布页
  • 进入详情页后，依然需要保持之前的页面存在，进行正常返回

2.2、自定义 tabBar 跳转方式 wx.reLaunch

使用效果

• 每次切换，都会关闭当前的所有页面，继而打开一个新页面
  • 如果使用 wx.navigateTo，通过 tabBar 的切换，很快就会超过 10 个路由栈层级
  • 如果使用 wx.redirectTo，存在路由栈超过 10 级的风险

tabBar 使用页面

• 首页——'pages/index/index'
• 发布——'pages/publish/index'
• 个人中心——'pages/profile/index'

2.3、wx.reLaunch 方式的使用

使用效果

• 关闭当前所有页面，打开一个新页面
• 路由栈层级级数变成 1

使用页面

• tabBar 组件
• 搜索页面，点击“取消/返回”按钮，进回“首页”
  • 如果该页面使用 wx.navigateTo，则进入的“首页”header 部分会显示“返回”图标
  • 如果该页面使用 wx.redirectTo，反复执行“首页——搜索页——首页”这个操作路径，会导致层级达到 10 级
  • 该页面，也可以使用 wx.navigateBack。在不清楚之后会有什么样交互的前提下，wx.reLaunch 更加保险

2.4、wx.navigateBack 方式的使用

使用条件

• 不需要返回到当前页面时
• 返回层级数目明确的情况下使用

使用效果

• 关闭当前页面，进入之前的页面
  • 在之前的页面点击返回按钮，不会再进入该页面
• 路由栈层级减少一级
  • 跟在当前页的路由栈层级比较起来，减少一级
  • 跟进入该页面之前比起来，路由栈层级不变

使用页面

• 发布页面，在编辑状态下，提交成功后，返回“该商品详情页”
• 发布页面，在编辑状态下，如果获取初始信息失败，返回“该商品详情页”
• 新增联系方式页面，提交成功后，返回“联系方式列表页面”

2.5、wx.navigateTo 方式的使用

使用条件

• 需要返回到当前页面时，使用该方法

使用效果

• 保留当前页面，打开一个页面
  • 可以在新页面返回到当前页面
• 路由栈层级增加一级
• 谨慎使用

使用页面

• 首页推荐产品、搜索结果页，点击商品图片，进入“该商品详情页”
• 首页分类模块，点击“分类图标”，进入“搜索-结果页”
• 首页搜索模块，点击“搜索栏”，进入“搜索页”
• 商品详情页面，点击“管理——编辑”，进入“发布页面-编辑态”
• 搜索页面-模糊搜索结果，点击“商品标题”，进入“该商品详情页”
• 个人中心，进入“修改个人信息页面”、“反馈页面”、“进入联系方式页面”、“发布/收藏产品列表页面”
• 个人中心-我的发布、我的收藏页面，点击商品图片，进入“该商品详情页”
• 个人中心-联系方式页面，点击“新增按钮”，进入“新增页面”

三、注意事项

• 尽量保证每个跳转循环完成后，路由层级不会增加，最好只有一个路由层级
• 注意出现页面跳转循环的路径

四、分包

• app:首页 商品详情页
• 搜索
• 发布
• 个人中心