react实现步进器

创建一个步进器组件，包含当前步骤（currentStep）的状态以及前进和后退的操作：

import React, { useState } from 'react';

function Stepper() {
  const [currentStep, setCurrentStep] = useState(1);

  const handleNext = () => {
    setCurrentStep(currentStep + 1);
  };

  const handlePrevious = () => {
    setCurrentStep(currentStep - 1);
  };

  return (
    

      
Current Step: {currentStep}
      
        Previous
      
      
        Next
      
    
  );
}

export default Stepper;

在应用中使用该步进器组件：

import React from 'react';
import Stepper from './Stepper';

function App() {
  return (
    

      
      {/* 其他组件 */}
      {/* ... */}
    
  );
}

export default App;

以下是一个完整步进器的例子：

import React, { useState } from "react";

function Stepper() {
  const [count, setCount] = useState(0);

  const handleIncrement = () => {
    setCount(count + 1);
  };

  const handleDecrement = () => {
    setCount(count - 1);
  };

  return (
    

      
Count: {count}
      +
      -
    
  );
}

export default Stepper;