useManualRefHistory 是 Vueuse 库中的一个自定义钩子函数，用于跟踪和管理 ref 值的变化历史记录。
通常情况下，Vue 的响应式系统会自动追踪 ref 值的变化，并在变化时更新相关的依赖和重新渲染组件。然而，有时候我们可能需要手动管理 ref 值的变化历史，以便实现一些特定的功能，比如撤销/重做操作或时间旅行等。
useManualRefHistory 提供了一种方便的方式来跟踪和管理 ref 值的变化历史记录。它返回了一组函数和属性，可以用于手动记录和管理 ref 值的变化。
使用 useManualRefHistory 可以实现以下功能：
- 手动记录 ref 值的变化，创建变化历史记录。
- 回退到先前的历史记录状态，实现撤销操作。
- 前进到后续的历史记录状态，实现重做操作。
- 获取当前的历史记录状态。
- 清除历史记录，重置到初始状态。
通过使用 useManualRefHistory，开发者可以更灵活地管理 ref 值的变化历史，从而实现一些高级的交互和状态管理功能。
useRefHistory 主要是基于 useManualRefHistory实现，提供了自动化的跟踪和记录机制，适用于大多数常见的场景。
示例
import { ref } from 'vue'
import { useManualRefHistory } from '@vueuse/core'
const counter = ref(0)
const { history, commit, undo, redo } = useManualRefHistory(counter)
counter.value += 1
commit()
console.log(history.value)
/* [
{ snapshot: 1, timestamp: 1601912898062 },
{ snapshot: 0, timestamp: 1601912898061 }
] */
可以使用 "undo" 来将 ref 值重置为最近的历史记录点。
console.log(counter.value) // 1
undo()
console.log(counter.value) // 0
可变对象的历史记录
如果要修改源对象，需要传递一个自定义的克隆函数或使用参数 clone: true。这是一个简化的克隆函数 x => JSON.parse(JSON.stringify(x))，它将在 dump 和 parse 中使用。
import { ref } from 'vue'
import { useManualRefHistory } from '@vueuse/core'
const counter = ref({ foo: 1, bar: 2 })
const { history, commit, undo, redo } = useManualRefHistory(counter, { clone: true })
counter.value.foo += 1
commit()
自定义克隆方法
同 useRefHistory
自定义 dump 和 parse
同 useRefHistory
