表单校验不只是判断为空

表单是业务系统里最常见的交互，但也是最容易粗糙处理的地方。很多页面只做了“必填不能为空”，提交失败后弹一个提示。用户不知道哪个字段错了，也不知道是否已经提交成功，更不知道能不能再次点击。真正可用的表单校验，应该覆盖输入前、输入中、提交中和提交后。

一、错误提示要靠近问题

字段级错误应该出现在字段附近，告诉用户具体如何修改。全局提示适合说明系统异常或跨字段问题，例如“时间范围不合法”“两次密码不一致”。如果所有错误都用顶部提示，用户需要自己回到表单里寻找问题，体验会很差。

校验时机也要克制。刚进入页面就标红所有空字段，会制造压力；用户输入过程中每个字符都报错，也容易打断输入。更自然的做法是字段失焦后提示，提交时统一补齐未触发的校验。

二、提交态要防止重复动作

表单提交后，按钮应该进入 loading 或禁用状态，避免用户重复点击。这个状态不只是视觉效果，还要阻止实际重复请求。提交完成后再根据结果恢复按钮、关闭弹窗、刷新列表或保留表单让用户修正。

三、服务端错误要回填到前端

前端校验只能处理基础规则，最终仍要以服务端为准。比如用户名重复、权限不足、库存变化、验证码过期，这些都需要服务端返回明确错误。前端接到后应该尽量映射到字段或具体区域，而不是统一显示“提交失败”。

• 字段错误放在字段附近，全局错误只处理全局问题。
• 提交按钮要有 loading 和重复点击保护。
• 服务端业务错误要尽量保留原语义。
• 提交成功后的关闭、刷新和重置要有固定顺序。

表单是用户和系统建立信任的地方。提示清楚、状态稳定、失败可恢复，才会让用户敢继续操作。