| 微信小程序, 导航

微信小程序导航不生效处理

在微信小程序开发过程中，如果你发现wx.navigateTo/wx.redirectTo 无效了，放在别的页面却有效，可以从以下几点入手。

  1. 你的页面在app.json文件中注册了吗？
  2. 你的url地址写对了吗，目录层级没错吗?
  3. 你要跳转到的页面是非tabBar的页面吗？如果是tabBar（指的是底部有导航菜单的页面，如下图 底部的首页，用户中心菜单）页面，恭喜你，找到问题了。

tabBar页面

wx.navigateTo/wx.redirectTo只能用在非tabBar页面的跳转
示例如下：

1
2
3
4
5
6
7
loginBtnClick: function(){
    app.appData.userinfo = {username: this.data.username, password: this.data.password}
    wx.redirectTo({
      url: '../user/user',
    })
    console.log(app.appData.userinfo.username);
  }

此处要跳转的页面为用户中心，是带tabBar的页面，故无法跳转，将wx.redirectTo改为wx.switchTab即可

附：tabBar的配置
在根目录下找到app.json文件，添加以下代码：

1
2
3
4
5
6
7
8
9
"tabBar": {
    "list": [{
      "pagePath": "pages/index/index",
      "text": "首页"
    }, {
      "pagePath": "pages/user/user",
      "text": "用户中心"
    }]
  }