介绍

开发中90%场景使用编程式导航，可在跳转前增加登录判断、弹窗提示、接口请求等逻辑。下面逐个讲解API、适用场景、完整代码。

wx.navigateTo：保留当前页，跳转非Tab新页面

场景：列表→详情、个人中心→设置、弹窗页面

特点：页面栈+1，左上角自带返回箭头，不能跳转Tab页面

Page({
  // 点击按钮跳转
  goDetail() {
    wx.navigateTo({
      url: '/pages/detail/detail?id=10086&title=商品详情',
      success: () => console.log('跳转成功'),
      fail: () => console.log('跳转失败'),
      complete: () => console.log('跳转调用完成')
    })
  }
})

wx.redirectTo：关闭当前页，跳转新页面

场景：登录成功跳转首页、启动页跳转首页（不需要返回上一页）

特点：当前页面直接被替换，无法返回被关闭的页面，减少页面栈堆积

loginSuccess() {
  // 登录成功，关闭登录页，跳转到首页，无法返回登录页
  wx.redirectTo({
    url: '/pages/index/index'
  })
}

wx.navigateBack：返回之前页面（逆向跳转）

场景：自定义返回按钮、返回多层页面

参数delta：返回的页面层数，delta:1返回上一页，delta:2返回上两页，delta不传默认1

// 返回上一页
goBack1() {
  wx.navigateBack({ delta: 1 })
},
// 返回首页（直接退出多层页面）
goBackIndex() {
  wx.navigateBack({ delta: 3 })
}

注意：delta值不能超过当前页面栈层数，否则返回失效。

wx.switchTab：专门跳转Tabbar页面

场景：底部Tab栏切换（首页、分类、我的）

硬性规则：

1. url必须是app.json中注册的tabBar页面

2. 不支持url拼接参数

3. 会关闭所有非tabbar页面

switchMine() {
  wx.switchTab({
    url: '/pages/mine/mine'
  })
}

wx.reLaunch：关闭所有页面，跳转任意页面

场景：退出登录回到首页、清空所有页面栈强制跳转

特点：页面栈直接清空，无返回按钮，可跳转Tab/非Tab页面

logout() {
  // 退出登录，清空所有页面，回到首页
  wx.reLaunch({
    url: '/pages/index/index'
  })
}

使用场景选型

避坑

坑：navigateTo/redirectTo 无法跳转Tab页面

✅ 正确做法：Tab页面只能使用 switchTab / reLaunch 跳转

坑：页面栈超过10层跳转失败

✅ 解决方案：频繁跳转页面使用redirectTo替换页面，减少页面栈堆积

坑：redirectTo/reLaunch跳转后，无法返回之前页面

✅ 业务注意：登录、引导页这类无需返回的页面再使用，详情页不要乱用

原文出处：/show_1GW3XNfcGRGo.html