React Hook Form Resolvers 中 raw 选项的深层解析与解决方案

在 React Hook Form 生态系统中，zodResolver 是一个常用的表单验证工具，它能够将 Zod 验证库与 React Hook Form 无缝集成。然而，近期发现了一个关于 raw: true 选项的重要行为差异，这可能会对开发者的表单处理逻辑产生深远影响。

问题本质

当开发者使用 zodResolver 并设置 raw: true 选项时，预期行为是获取表单提交时的原始值快照。但实际上，当前实现传递的是 React Hook Form 内部用于管理表单状态的对象引用，而非预期的值快照。

这种差异导致了一个关键问题：如果在表单提交后修改表单字段，这些修改会意外地影响之前存储的提交数据，即使没有再次调用提交处理函数或状态更新函数。

技术细节分析

在 React Hook Form 的工作机制中，表单数据通常被存储在一个内部状态对象中。当不使用 raw: true 选项时，zodResolver 会处理这些值并返回经过验证的数据副本。然而，当启用 raw 选项时，当前的实现直接传递了内部状态对象的引用。

这种行为违背了"值快照"的原则，因为：

1. 它允许后续的表单修改影响之前提交的数据
2. 破坏了数据不可变性的预期
3. 可能导致难以追踪的副作用和bug

解决方案与最佳实践

在最新版本(4.0.0)中，这个问题已经得到修复。现在，无论是否使用 raw: true 选项，提交处理函数都会接收到表单值的快照而非引用。

对于开发者而言，这意味着：

1. 可以安全地存储提交的表单数据而不必担心后续修改
2. 数据流更加可预测和可靠
3. 减少了由意外引用共享引起的bug

升级建议

对于正在使用早期版本的项目，建议尽快升级到4.0.0版本以获得这一重要修复。在升级过程中，开发者应该：

1. 检查现有代码中是否依赖了之前的行为
2. 审查所有使用 raw: true 选项的表单处理逻辑
3. 确保测试覆盖表单提交后的数据不变性

总结

这个修复体现了 React Hook Form 生态对数据一致性和开发者体验的持续关注。通过确保表单提交提供真正的值快照，它使表单处理更加可靠和可预测，符合现代React应用开发的最佳实践。