storybook 编写stories的story基础语法

在Storybook中编写stories的基础语法如下：

文件命名与结构：
- 每个组件都可以有多个故事，这些故事通过在组件文件夹中以.component.stories.ts格式的文件实现。
- 故事函数定义在文件中，并通过export导出。
故事函数：
- 故事函数定义了组件的不同状态或使用场景。
- 可以使用解构语法来复用输入属性的配置。
- 故事函数直接导出，使得组件在独立运行时，用户可以自由地调整属性并实时查看效果。
Args：
- Args代表组件的输入属性。
- 分为两层结构，方便灵活地设置组件的不同状态。
Parameters：
- Parameters用于配置Storybook的额外功能，如backgrounds插件可以定制组件容器的背景色。
- 参数配置可以在全局、组件和story级别进行设置，支持继承，子级会覆盖父级定义。
Decorators：
- Decorators用于在保持故事原貌的同时，添加额外的DOM元素、上下文或模拟数据。
- 装饰器支持全局、组件和故事级别的定义，按照定义顺序执行，从全局到故事级别。
- 装饰器可用于为组件渲染添加特定容器高度或为复合组件引入依赖等场景。

通过stories和各种配置项，Storybook为组件开发提供了直观的测试和展示工具，极大地方便了组件的开发和文档化。

热门标签