微信小程序路由跳转

1. wx.navigateTo

• 作用：保留当前页面，跳转到应用内的某个页面。
• 特点：跳转后目标页面的生命周期函数 onLoad 和 onShow 会被触发。
• 使用场景：一般用于跳转到应用内的其他页面，保留当前页面的状态，例如从文章列表页跳转到文章详情页。

2. wx.redirectTo

• 作用：关闭当前页面，跳转到应用内的某个页面。
• 特点：跳转后当前页面会被销毁，目标页面的生命周期函数 onLoad 和 onShow 会被触发。
• 使用场景：一般用于页面之间的替换跳转，例如在登录页成功登录后跳转到首页。

3. wx.switchTab

• 作用：跳转到指定的 tabBar 页面，并关闭其他所有非 tabBar 页面。
• 特点：只能跳转到 tabBar 页面，不能跳转到非 tabBar 页面。
• 使用场景：一般用于跳转到应用底部的导航栏页面，例如从其他页面跳转到应用的首页。

4. wx.reLaunch

• 作用：关闭所有页面，打开到应用内的某个页面。
• 特点：关闭所有页面，包括所有的 tabBar 页面，然后打开目标页面。
• 使用场景：一般用于程序重启或者清空页面栈后跳转到某个页面，例如在应用设置中进行设置后重启应用。

假设我们有一个小程序，包含以下页面：

1. 首页：pages/index/index
2. 文章详情页：pages/detail/detail
3. 用户设置页：pages/settings/settings

现在，我们来实现一个场景：用户从首页点击文章进入文章详情页，然后从文章详情页跳转到用户设置页，最后从用户设置页返回到首页。

1. 在首页设置点击事件跳转到文章详情页

// pages/index/index.js
Page({
  // 点击文章跳转到详情页
  gotoDetail: function () {
    wx.navigateTo({
      url: '/pages/detail/detail?id=123&title=Sample Article'
    });
  }
});

2. 在文章详情页设置点击事件跳转到用户设置页

// pages/detail/detail.js
Page({
  // 点击设置跳转到设置页
  gotoSettings: function () {
    wx.navigateTo({
      url: '/pages/settings/settings'
    });
  }
});

3. 在用户设置页设置点击事件返回首页

// pages/settings/settings.js
Page({
  // 点击返回首页
  goBackToIndex: function () {
    wx.switchTab({
      url: '/pages/index/index'
    });
  }
});

通过以上代码，我们实现了一个简单的场景：用户从首页跳转到文章详情页，然后跳转到用户设置页，最后从用户设置页返回到首页。在这个过程中，我们分别使用了 wx.navigateTo、wx.switchTab 这两个导航API来实现不同的跳转效果。