history.state

`history.state` 属性返回当前页面的历史状态对象。它可以用来存储和获取与特定历史条目相关的数据。当通过调用 `history.pushState()` 或 `history.replaceState()` 方法添加或修改历史条目时，可以提供一个状态对象作为参数。这个状态对象可以在后续调用 `history.state` 时获取。如果当前页面没有历史记录，则 `history.state` 返回 `null`。

相关问题

vue-router.mjs:35 [Vue Router warn]: history.state seems to have been manually replaced without preserving the necessary values. Make sure to preserve existing history state if you are manually calling history.replaceState: history.replaceState(history.state, '', url)

这是 Vue Router 给出的一个警告，意思是你可能在手动调用 `history.replaceState` 的时候替换了 `history.state`，而没有保存必要的值。如果你确实需要手动调用 `history.replaceState`，则需要在第一个参数中传入 `history.state`，以保留现有的历史状态。例如：

history.replaceState(history.state, '', url)

这样做可以避免 Vue Router 报出这个警告。如果你不需要手动调用 `history.replaceState`，则可以忽略这个警告。

window.history.state 获取position 等信息

`window.history.state` 是浏览器历史管理API的一部分，它提供了一个对象，用于存储有关当前页面位置的信息。当你通过点击浏览器前进或后退按钮导航时，这个属性可以让你访问到先前页面的状态数据，包括但不限于：

1. `position`：这不是直接提供的属性名，如果是指页面滚动的位置，你需要通过 JavaScript 的 `scrollY` 或 `scrollTop` 属性获取。例如：

   var position = window.pageYOffset || document.documentElement.scrollTop;

2. 其他状态信息：你可以设置任意键值对作为状态对象，如：

   window.history.pushState({ key: 'value' }, 'Title', '/newPage');

接着在需要的地方，可以使用 `window.history.state` 来获取这些自定义的数据。

然而，需要注意的是，`window.history.state` 只能在同源策略允许的范围内使用，即只能在用户主动触发或你的脚本更改浏览历史时访问。同时，为了保持良好的用户体验，不应过度依赖 `history.state`，因为它不是持久化的，刷新页面会丢失之前存储的状态。