用途:配置 Storybook 中的交互式控件(Controls)与参数(args),使组件演示可动态调整、实时探索,便于设计师和开发者测试组件变体。
主要能力:args 是 Storybook 跟踪并交互的组件输入,可在 story 中通过 args 字段定义;argTypes 定义参数元数据,包括控件类型和文档说明。支持的控件类型有 text、number、boolean、color、date、select、radio、range、object、array。可用 action 追踪事件回调,在 Actions 面板显示;支持条件控件(if 条件按其他 arg 值显示或隐藏)、禁用控件(control: false 或 table: { disable: true })、控件分组(table.category)。
使用方式:在 meta 中使用 satisfies Meta<typeof Component>,并在 argTypes 中配置 control、options、description、table 等。可由 TypeScript 类型自动推断控件,也可手动覆盖;在 meta 层设置默认 args;用 table 补充默认值与类型摘要。复杂对象用 object 控件,枚举用 select 或 radio。
适用场景:需要为组件提供可交互演示、便于测试不同 props 组合的 Storybook 项目。
限制与注意:不要用控件编辑大型静态模拟数据,应设 control: false;不要在 render 中硬编码覆盖 args,应在 args 中设置;不要在多个 story 重复定义 argTypes,应放在 meta 层。完整安装命令与版本信息暂未提供。