ember.js 如何在转换过程中维护未知/通配符queryParams?

dzjeubhm  于 2022-11-05  发布在  其他
关注(0)|答案(1)|浏览(114)

我有一个转换到另一个路由(route-b)的路由(route-a),我试图找到一种方法,使目的地URL保持 all 查询参数,即使route-b事先不知道它们。
例如,如果用户访问https://example.com/route-a/?var1=x&var2=y,则向route-b的转换如下所示:

afterModel(model, transition) {
  this.transitionTo('route-b', model, {queryParams: transition.to.queryParams}) // transition route-a to route-b
}

...最终的URL将是https://example.com/route-b/- * 不带 * 查询参数。
现在,我意识到“Ember方式”是预先在route-b的控制器上定义queryParams,但是在这个特定的用例中,* 我事先不知道queryParams *。路由B使用提供给它的任何和所有查询参数,这意味着它们不可能预先枚举。
如何在不删除目的路由控制器上未具体枚举的查询参数的情况下转换到新路由?
是否有方法处理未知的queryParams,或者是否有queryParams通配符的概念(类似于*path路由)?

huwehgph

huwehgph1#

**更新:**我没有把这个标记为答案,因为正如jelhan在下面提到的,在文档中明确指出,为这个键使用计算属性是不允许的。但是它对我们的用例有效,对其他用例也可能有效,尽管我猜如果在其他路径中有额外的queryParams,当Ember试图合并它们时,可能会发生冲突,它可能会崩溃。
上一个答案:

我的解决方案最终使用Ember的computed方法,通过解析URL自动生成查询参数Array。

queryParams: computed("router.location", function () {
    let qp = this.get("router.location").getURL().split("?")[1];
    if (qp) {
      let qpAsObj = JSON.parse(
        '{"' +
          decodeURI(qp)
            .replace(/"/g, '\\"')
            .replace(/&/g, '","')
            .replace(/=/g, '":"') +
          '"}'
      );
      return Object.keys(qpAsObj)
    }
  })

如果您不想在用户下次再次访问页面时在页面/模型上维护这些查询参数(“sticky query params”),您还需要删除路由上的queryParams:

resetController(controller) {
    // unset all queryParams when leaving the route
    controller.queryParams.forEach(v => {
      controller.set(v, null)
    })
  }

这个解决方案...不是很理想,但它可以工作,我们编写了测试,以确保我们将捕捉任何错误,如果它中断前进。

相关问题