讲师中心 微信公众号
AI工具推荐 视频效率加速

Zod 如何正确获取嵌套数组对象中的字段级校验错误

雨涛酱_5252

雨涛酱_5252

发布时间:2026-02-07 13:04:07

|

435人浏览过

|

来源于php中文网

原创

Zod 如何正确获取嵌套数组对象中的字段级校验错误

当使用 zod 校验包含对象数组的结构(如 `sizes: [{ price, off_price, sell_quantity }]`)时,若数组元素缺失必填字段,`.flatten()` 默认无法展开嵌套路径错误;需改用 `.format()` 或遍历 `.issues` 才能精准定位到 `sizes[0].price` 等具体字段错误。

Zod 的 .flatten() 方法设计用于扁平化顶层字段错误(如 "sizes" 本身为空),但对数组内嵌套对象的字段级错误(如 sizes[0].price)默认不递归展开——这正是你遇到 "sizes":["Required","Required","Required"] 这类模糊提示的根本原因。

要真正暴露每一项的细粒度错误,推荐以下两种专业方案:

✅ 方案一:使用 .format() 获取结构化嵌套错误(推荐)

.format() 返回一个与原始数据结构对齐的错误树,天然支持数组索引和对象键路径:

创意前端视觉设计
创意前端视觉设计

在创建或重塑需要独特视觉方向、应避免通用 AI 生成审美的网站、落地页、仪表盘、UI 组件、海报或应用时使用。

下载
const result = schema.safeParse({ sizes: [{}] });

if (!result.success) {
  const formatted = result.error.format();
  console.log(formatted.sizes?.[0]);
  // 输出:
  // {
  //   _errors: [],
  //   price: { _errors: ['Required'] },
  //   off_price: { _errors: ['Required'] },
  //   sell_quantity: { _errors: ['Required'] }
  // }
}
? 提示:.format() 支持深度嵌套,适用于任意层级(如 sizes[0].variants[1].sku),且返回值类型安全(TypeScript 可推导)。

✅ 方案二:手动解析 .issues 获取完整路径与上下文

当需要自定义错误聚合逻辑(如生成 i18n 错误消息或上报日志)时,直接操作 issues 数组更灵活:

if (!result.success) {
  const fieldErrors: Record<string, string[]> = {};

  for (const issue of result.error.issues) {
    // 构建可读字段路径:sizes.0.price → "sizes[0].price"
    const path = issue.path.map((p, i) => 
      typeof p === 'number' ? `[${p}]` : i === 0 ? p : `.${p}`
    ).join('');

    fieldErrors[path] = fieldErrors[path] || [];
    fieldErrors[path].push(issue.message);
  }

  console.log(fieldErrors);
  // {
  //   "sizes[0].price": ["Required"],
  //   "sizes[0].off_price": ["Required"],
  //   "sizes[0].sell_quantity": ["Required"]
  // }
}

⚠️ 注意事项

  • 避免 .nonempty() 与字段级校验冲突:你原 schema 中 z.string().nonempty() 要求字符串非空,但若传入 "",Zod 会报 "Expected string, received "" 而非 "Required"。如需严格“必填+非空”,建议拆分为 z.string().min(1) 或用 .refine() 增强语义。
  • .strict() 影响错误位置:启用 .strict() 后,多余字段也会触发错误,但不影响字段级错误的提取逻辑。
  • 生产环境建议封装工具函数:将 .format() 或 issues 解析逻辑封装为 getDetailedErrors(schema, data) 工具,统一处理表单级/字段级错误渲染。

通过以上方式,你不仅能精准捕获 sizes[0].price 的缺失,还能为前端表单动态高亮具体输入框,大幅提升用户体验与调试效率。

热门AI工具

更多
PixTV
PixTV Hot

PixTV是一款面向AIGC内容创作的AI视频生成工具。

墨刀AI
墨刀AI Hot

一款AI图像与设计工具,主要用于产品经理的专属智能体,适合需要提升相关任务效率的用户。

DeepSeek

DeepSeek是一款面向对话、写作、编程和推理场景的AI大模型工具。

超级麦吉

一款通过数字员工协作完成调研、数据分析与文档制作的AI办公平台。

UpDream
UpDream Hot

一款AI视频创作工具,主要用于哔哩哔哩推出的自研AI视频创作工具,适合需要提升相关任务效率的用户。

PixPix
PixPix Hot

PixPix是一款面向电商视觉生产的AI商品图生成工具。

超级简历WonderCV

一款AI办公效率工具,主要用于免费求职简历模版下载制作,应届生职场人必备简历制作神器,适合需要提升相关任务效率的用户。

WorkBuddy

一款AI办公效率工具,主要用于腾讯云推出的AI原生桌面智能体工作台,适合需要提升相关任务效率的用户。

豆包大模型

豆包大模型是一款由字节跳动推出的企业级大语言模型服务平台。

相关专题

更多
TypeScript工程化开发与Vite构建优化实践
TypeScript工程化开发与Vite构建优化实践

本专题面向前端开发者,深入讲解 TypeScript 类型系统与大型项目结构设计方法,并结合 Vite 构建工具优化前端工程化流程。内容包括模块化设计、类型声明管理、代码分割、热更新原理以及构建性能调优。通过完整项目示例,帮助开发者提升代码可维护性与开发效率。

312

2026.02.13

TypeScript全栈项目架构与接口规范设计
TypeScript全栈项目架构与接口规范设计

本专题面向全栈开发者,系统讲解基于 TypeScript 构建前后端统一技术栈的工程化实践。内容涵盖项目分层设计、接口协议规范、类型共享机制、错误码体系设计、接口自动化生成与文档维护方案。通过完整项目示例,帮助开发者构建结构清晰、类型安全、易维护的现代全栈应用架构。

520

2026.02.25

TypeScript类型系统进阶与大型前端项目实践
TypeScript类型系统进阶与大型前端项目实践

本专题围绕 TypeScript 在大型前端项目中的应用展开,深入讲解类型系统设计与工程化开发方法。内容包括泛型与高级类型、类型推断机制、声明文件编写、模块化结构设计以及代码规范管理。通过真实项目案例分析,帮助开发者构建类型安全、结构清晰、易维护的前端工程体系,提高团队协作效率与代码质量。

391

2026.03.13

TypeScript 全栈开发进阶指南
TypeScript 全栈开发进阶指南

面向有 JavaScript 基础的开发者,深入讲解 TypeScript 的类型系统与全栈开发实践。

306

2026.06.03

TypeScript Node.js 全栈工程化与Monorepo架构实践
TypeScript Node.js 全栈工程化与Monorepo架构实践

本专题围绕 TypeScript 在 Node.js 全栈开发中的工程化实践展开,系统讲解 Monorepo 架构设计、包管理策略、模块复用机制以及服务端与前端统一类型系统的构建方法。通过真实项目案例,帮助开发者提升大型全栈项目的可维护性与协作效率。

678

2026.06.16

string转int
string转int

在编程中,我们经常会遇到需要将字符串(str)转换为整数(int)的情况。这可能是因为我们需要对字符串进行数值计算,或者需要将用户输入的字符串转换为整数进行处理。php中文网给大家带来了相关的教程以及文章,欢迎大家前来学习阅读。

6859

2023.08.02

format在python中的用法
format在python中的用法

Python中的format是一种字符串格式化方法,用于将变量或值插入到字符串中的占位符位置。通过format方法,我们可以动态地构建字符串,使其包含不同值。php中文网给大家带来了相关的教程以及文章,欢迎大家前来阅读学习。

1789

2023.07.31

python中的format是什么意思
python中的format是什么意思

python中的format是一种字符串格式化方法,用于将变量或值插入到字符串中的占位符位置。通过format方法,我们可以动态地构建字符串,使其包含不同值。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

1211

2024.06.27

Vite 项目如何打包和部署
Vite 项目如何打包和部署

Vite项目打包部署专题汇集生产构建、产物预览、输出目录、资源路径、Nginx与GitHub Pages部署及常见白屏和路由404问题的已审核文章,帮助读者完成上线流程。

60

2026.10.28

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn