同步 Rails 验证与 Formik：实用方法

Source: Dev.to

在许多 SaaS 应用中，我们在 onboarding 期间允许使用“占位符”数据，以降低摩擦。但当这些数据稍后需要验证时该怎么办？我最近在 PostCo 通过在 Rails 后端和 React 前端之间搭建桥梁来解决了这个问题。

关键技术要点

• 后端验证器： 不要仅仅依赖 presence: true。我创建了一个 PlaceholderValidator 来检查特定字符串，例如 "Address pending" 或 "00000"。
• 错误桥接： Formik 期望特定的结构。我编写了一个工具函数，将 Rails 的 errors.messages 转换为 Formik 能消费的扁平化对象，并加入了大小写映射层。
• 用户体验技巧： 如果字段中有占位符，用户不应手动删除它。我实现了一个 “编辑时清除” 的工具，将占位符在 UI 中视作 ""，从而触发即时的 Yup 验证。

处理嵌套错误往往很混乱，但只要加一点映射逻辑，就能让一个由初级开发者构建的功能拥有高级的感觉。