Mam pięć kroków na reakcję stepzilli, ale na pierwszym kroku chciałem ukryć następny przycisk. Próbowałem:

    const steps =
        [
          {name: 'Step 1', component: <PaginationPage1 showNavigation={false}/>},
          {name: 'Step 2', component: <PaginationPage2/>},
          {name: 'Step 3', component: <PaginationPage3/>},
          {name: 'Step 4', component: <PaginationPage4/>},
          {name: 'Step 5', component: <PaginationPage5/>}
        ];

Co mi nie pomaga. Jak mogę ukryć przycisk w kroku 1?

2
user12016539 20 grudzień 2019, 02:05

1 odpowiedź

Użyj stanu komponentu nadrzędnego w połączeniu z wywołaniem zwrotnym onStepChange:

function App() {
  let [showNavigation, setShowNavigation] = useState(false);
  let stepzillaProps = {
    onStepChange: step => setShowNavigation(step === 0 ? false : true),
    steps,
    showNavigation
  };
  return (
    <div className="App">
      <StepZilla {...stepzillaProps} />
    </div>
  );
}

Oto przykład

1
Martin 20 grudzień 2019, 02:27