用途:该技能为 Web 应用中的表单与数据采集界面提供系统化指导,包括联系表单、登录/注册流程、结账流程、问卷和设置页。
主要能力:按“数据类型→输入组件→验证模式”选择组件;给出验证时机策略(默认失焦验证,首次报错后改为输入时验证);提供 WCAG 2.1 AA 无障碍要求(label、键盘导航、错误关联与播报、ARIA 属性);整理现代表单 UX 实践(渐进披露、智能默认值、内联验证、移动优先、自动保存与恢复);给出错误信息写法与语气建议;按组件层级划分基础输入、富输入和复杂表单模式(多步向导、条件字段、动态数组、自动保存等)。
使用方式:资料提供 JavaScript/React 推荐技术栈 React Hook Form、Zod、Radix UI 或 React Aria,示例命令保持原样:import { useForm } from 'react-hook-form';、import { zodResolver } from '@hookform/resolvers/zod';、import * as z from 'zod';。Python 推荐 Pydantic、FastAPI、WTForms,示例命令保持原样:from fastapi import FastAPI, HTTPException、from pydantic import BaseModel, EmailStr, Field, validator。Rust 与 Go 为规划中,暂未提供实现。
适用场景:构建联系、注册、结账、问卷、设置等表单及多步流程,或需要为输入添加验证与无障碍支持时。
限制:具体安装命令、价格与平台信息暂未提供;Rust/Go 实现、设计令牌细节及部分参考文档链接未在资料中展开说明。