ember.js 如何在ember 3中重置路线更改滚动？

cgvd09ve 于 2022-11-05 发布在其他

关注(0)|答案(1)|浏览(169)

我尝试使用hook activate、didTransition或willTransition，但这些都不起作用，它们什么都不做。我尝试从一条路线开始：
第一个
这在我的js浏览器控制台中工作：

scroll(0, 0);

这是我的路由器

// app/router.js
...
Router.map(function() {
  this.route('docs');
  this.route('section', { path: '/docs/section/:slug' });
});

如果我把section作为docs的子项，只要我不隐藏父项的内容，它就可以工作，但是我想隐藏它。链接到组件中的锚可能会有帮助。

当我移除这部分CSS时，它可以工作。

html {
  scroll-behavior: smooth;
}

1条答案

你的方法和预期的一样有效。我已经创建了一个灰烬旋转来验证这个，你可以找到here。它有两个路径。一个在激活时滚动到顶部，另一个在激活时滚动到底部。它和预期的一样滚动。
我猜如果在子路由之间转换，您可能会遇到钩子的问题？路由被视为保持活动状态，而激活钩子 * 不 * 被调用

如果你想在每次切换时都滚动到顶部，或者想有更精细的控制，哪些切换应该触发滚动，我建议使用routeDidChange event of RouterService代替。