Vue3 - 如何将 reactive() 创建的响应式数据 “轻松“ 恢复成初始数据值，重置 reactive() 定义的数据使其恢复成初始定义的数据结构（使用一个函数轻松解决，并且不丢失响应式）

前言

典型的场景就是我有一个表单，用户输入了一些内容后，点击提交后程序需要 “重置表单” 把上次填过的内容重置掉。

本文实现了 一个函数重置 reactive 创建的数据，恢复 “最开始时的数据结构和默认值，”

你可以直接复制本文提供的函数，有三种方案可选。

---

解决方案 1

直接调用函数，传入数据即可。

/*
 * reactive数据重置器
 * @description 传入对象即可
 * @param {Object} data - reactive对象数据
 * @return void
 */
const resetData