如何使用history.pushState管理URL

要使用history.pushState来管理URL，首先需要调用pushState()方法。该方法接受三个参数：状态对象（state object）、标题（title）和可选的URL。

例如，要在URL中添加一个新的查询参数，可以这样做：

const newUrl = new URL(window.location.href);
newUrl.searchParams.set('param', 'value');

history.pushState(null, null, newUrl.toString());

这将向浏览器历史记录添加一个新的状态，并且URL将包含新的查询参数。可以通过调用popstate事件监听器来监听URL变化，并在需要时执行相应的操作。

window.addEventListener('popstate', function(event) {
  // 在这里执行需要的操作
});

通过这种方式，可以使用history.pushState来动态管理URL，并实现单页面应用的路由控制。