계단식으로 하다

앱에서 단계별 작업 흐름을 생성하기 위한 라이브러리

• 빠르고 효율적

• 강력하고 유연함

• 경량(< 1kB gzipped)

• 완전히 형식이 안전함

• 컴포저블 아키텍처

• 최대 사용자 정의를 위해 스타일이 지정되지 않음

설치

 npm 설치 @stepperize/react

빠른 시작

1. 생성자를 가져옵니다.

 "@stepperize/react"에서 {defineStepper }를 가져옵니다.

2. 단계를 정의하십시오.

 const { 범위 지정, useStepper, 단계 } = DefineStepper(
  { id: "1단계", 제목: "1단계", 설명: "1단계에 대한 설명" },
  { id: "2단계", 제목: "2단계", 설명: "2단계에 대한 설명" },
  { id: "3단계", 제목: "3단계", 설명: "3단계에 대한 설명" },
  { id: "4단계", 제목: "4단계", 설명: "4단계에 대한 설명" });

3. 구성요소에 후크를 사용하세요.

 함수 StepperComponent() {
  const { currentStep, nextStep, prevStep } = useStepper();

  return (
 
{currentStep.title}
 
{currentStep.description}
 이전  다음
  );}

작동 방식

Stepperize를 사용하면 고유 ID로 일련의 단계를 정의할 수 있습니다. defineStepper 사용하여 단계를 생성하면 다음을 얻을 수 있습니다.

• 컨텍스트 관리를 위한 Scoped 구성요소

• 단계 제어를 위한 useStepper 후크

• 렌더링을 위한 일련의 steps

각 단계의 유일한 필수 필드는 id 입니다. 필요한 추가 속성을 추가할 수 있으며 후크를 사용할 때 완전히 형식이 안전해집니다.

선적 서류 비치

사용법, 구성 및 고급 기능에 대한 자세한 내용을 보려면 전체 설명서를 방문하세요.

기여

우리는 기여를 환영합니다! 자세한 내용은 기여 가이드를 참조하세요.

특허

Stepperize는 MIT 라이센스를 받았습니다.