Vue.js 修改浏览器 URL 无刷新

使用 Vue.js 和 JavaScript 的 `window.history.pushState` 和 `$router.push` 方法修改浏览器 URL，无需刷新页面，并支持浏览器返回按钮功能。文章包含代码示例和详细解释。

2021年11月2日

Mt.r

期望实现 vue 不刷新页面修改 url

this.$router.push({
  query: {
    book: this.book + this.chapter
  }
})

JS 不刷新页面修改 url

如其名，push，支持点击返回

window.history.pushState(state, title, url);

如其名，replace，替换当前 url，不支持点击返回这些

window.history.replaceState({id: 1,name: "profile"},'下载','download?id=1');

后记

这个是 JS 实现不刷新页面修改 URL 的相关文章，写的很好：HTML5 实现无刷新修改 URL

复习一下元素操作 api：MND - insertAdjacentHTML