如何收听 SPA 中的后退/前进按钮单击？

Question

我有一个 Backbone 应用程序，它使用 Backbone.history.start({pushState: true})。我根据 URL 更改呈现页面，后退和前进按钮工作正常，视图呈现良好。

但有一个问题，当您单击后退或前进按钮时，不会保留页面滚动位置。这让人感觉非常糟糕。

我想我会保留一系列访问过的页面，并为每个页面存储滚动位置。然后我会听用户是否点击后退/前进，我会加载适当的滚动位置。

但是。

我刚刚发现我无法判断用户何时单击后退或前进按钮。如果可以的话，我会读取上一页存储的滚动位置并应用它。我做错了什么？

Answer 1

您可以将滚动位置存储为路线的一部分，使用类似：

router.navigate('/my/route/scroll/[my_scroll_location]', {replace: true});

所以它不会添加新的历史点，但会修改当前点。这样，当你点击“后退”时，它会转到上一个“页面”/路线，然后点击“前进”有足够的信息滚动到正确的点。