直接给 ref 的 .value 赋新值是安全推荐的重置方式；需预先保存初始值，如 const count = ref(0); const initialCount = 0；重置即 count.value = initialCount；嵌套对象需注意响应性，可用 reactive 统一管理或配合表单组件 resetFields 方法。
直接给 ref 的 .value 赋一个新值，是安全且推荐的重置方式——这和 reactive 有本质区别。因为 ref 的响应式核心就在 .value 这个属性上，Vue 持续追踪的是这个属性的变更，而不是它内部值的引用是否变化。
保存初始值是前提
重置的前提是：你得知道“初始值”是什么。不能靠猜，也不能临时构造。常见做法有三种：
-
在定义 ref 时就存一份初始值，比如：
const count = ref(0); const initialCount = 0; -
用常量统一管理，尤其适合表单字段多的场景：
const INITIAL_FORM = { name: '', age: null, isActive: false };然后const form = ref({ ...INITIAL_FORM }) -
从函数返回初始值，适用于初始值需动态计算或依赖注入的情况：
const getInitialData = () => ({ timestamp: Date.now() }); const state = ref(getInitialData());
重置 ref 的标准写法
只要初始值明确，重置就是一行代码的事：
- 基础类型（string/number/boolean）：
count.value = initialCount; - 对象或数组：
form.value = { ...INITIAL_FORM };或form.value = JSON.parse(JSON.stringify(INITIAL_FORM));（仅限可序列化结构） - 若用工厂函数初始化：
state.value = getInitialData();
注意嵌套对象的响应性保留
如果 ref 包裹的是一个深层嵌套对象，直接赋新对象没问题，但要注意：新对象里的子对象默认不是响应式的。如果你需要子属性也保持响应式，有两种选择：
- 用
reactive构建嵌套结构，再整体赋给ref：form.value = reactive({ user: reactive({ name: '' }) }) - 更常用的是，把整个数据结构都用
ref或reactive统一管理，避免混用导致响应性断裂
配合表单组件自动重置（如 Element Plus）
很多 UI 库的表单组件（如 <el-form>）提供原生重置方法，它会自动同步内部 model 和你的 ref 数据：
- 先通过
ref拿到表单实例：const formRef = ref<forminstance>()</forminstance> - 调用
formRef.value?.resetFields()，它会清空 UI 并将绑定的ref模型恢复为初始值（前提是模型本身是可重置的） - 若需手动控制，可在
resetFields后再执行一次form.value = { ...INITIAL_FORM }确保完全一致
