步进化

用于在应用程序中创建分步工作流程的库

• 快速高效

• 强大且灵活

• 轻量级（gzip 压缩后 < 1kB）

• 完全类型安全

• 可组合架构

• 无样式，可实现最大程度的定制

安装

npm 安装@stepperize/react

快速入门

1. 导入构造函数：

从“@stepperize/react”导入{defineStepper}；

2. 定义您的步骤：

 const { 作用域，useStepper，步骤 } = DefineStepper(
  { id: "step-1", title: "第 1 步", description: "第 1 步的说明" },
  { id: "step-2", title: "第 2 步", description: "第 2 步的说明" },
  { id: "step-3", title: "第 3 步", description: "第 3 步的说明" },
  { id: "step-4", title: "第 4 步", description: "第 4 步的说明" });

3. 在组件中使用钩子：

函数 StepperComponent() {
  const { 当前步骤，下一个步骤，上一个步骤 } = useStepper();

  return (
 
{currentStep.title}
 
{currentStep.description}
 上一步 下一步
  );}

它是如何运作的

Stepperize 允许您定义一系列具有唯一 ID 的步骤。当您使用defineStepper创建步骤时，您会得到：

• 用于上下文管理的Scoped组件

• 用于步骤控制的useStepper钩子

• 一系列渲染steps

每个步骤唯一必需的字段是id 。您可以添加所需的任何其他属性，并且在使用挂钩时它们将是完全类型安全的。

文档

有关使用、配置和高级功能的更多详细信息，请访问我们的完整文档。

贡献

我们欢迎贡献！请参阅我们的贡献指南了解更多详细信息。

执照

Stepperize 已获得 MIT 许可。