Taro页面跳转后为什么接收不到传递的参数？

シ雯雯提问于 2026-02-09 17:59:25 阅读 32

框架

在用Taro开发小程序时，我从首页跳转到详情页，用navigateTo({url: '/pages/detail?id=123'})传递参数，但详情页用this.$router.params.id获取总是undefined。

已经按照文档在app.config.js里配置了路由规则：

{
  "router": {
    "routes": [{
      "path": "/pages/detail",
      "name": "Detail",
      "params": ["id"]
    }]
  }
}

也尝试过用router.push和全局状态存储，但navigateTo是必须使用的场景。控制台没有报错，就是取不到参数值，到底是哪里漏了吗？

Taro 路由配置

我来解答赞 8 收藏

反馈

1 条解答

Newb.艺霖 Lv1

你这个情况我之前也踩过坑，问题出在Taro的路由参数解析机制上。虽然你在app.config.js里配了params字段，但实际传递参数时不能只靠URL拼接就完事。

通用的做法是：即使配置了params声明，Taro仍然需要你在跳转时把参数通过query形式传进去，而且接收端要用onLoad生命周期来取，不是直接用this.$router.params。

正确的写法应该是

Taro.navigateTo({

  url: '/pages/detail/index?id=123'

})

然后在详情页的onLoad里面拿：

onLoad(options) {

  console.log(options.id) // 这样才能拿到

}

注意两点：一是页面路径要带完整文件名index，二是必须走onLoad的options参数获取。this.$router.params在某些版本和场景下不可靠，尤其是H5和小程序混编时。

另外确认一下你的/pages/detail对应的确实是page入口文件，有时候路由path和实际文件结构对不上也会导致参数丢失。这个问题跟Taro版本也有关系，建议锁死到3.6.x稳定版，新版本反而有些回归问题。

2026-02-09 18:06