react实现步进器

import React, { useState } from 'react';
function Stepper() {
  const [currentStep, setCurrentStep] = useState(1);
  const handleNext = () => {
    setCurrentStep(currentStep + 1);
  };
  const handlePrevious = () => {
    setCurrentStep(currentStep - 1);
  };
  return (
    <div>
      <h2>Current Step: {currentStep}</h2>
      <button onClick={handlePrevious} disabled={currentStep === 1}>
        Previous
      </button>
      <button onClick={handleNext} disabled={currentStep === 3}>
        Next
      </button>
    </div>
  );
}
export default Stepper;

import React from 'react';
import Stepper from './Stepper';
function App() {
  return (
    <div>
      <Stepper />
      {/* 其他组件 */}
      {/* ... */}
    </div>
  );
}
export default App;