Корпус переключателя в функциональном компоненте React

Question

Я пытаюсь сделать многошаговую форму с регистром переключения, но я не знаю, почему изменение состояния с помощью nextPrev не меняет регистр.

export const FormSteps = ({items, pending}) => {
    const [step, setStep] = useState (2)
    const nextStep = () =>{
        setStep(prev=>({
            ...prev,
            step: step + 1
        }))
    }
    const prevStep = ()=>{
        setStep(prev=>({
            ...prev,
            step: step-1
        }))
    }
    switch (step){
        case 1:
            return(
                <StepOne 
                nextStep={nextStep}
                />
            )
        case 2:
            return(
                <StepTwo
                nextStep={nextStep}
                prevStep={prevStep}
                />
            )
        case 3:
            return(
                <StepThree 
                nextStep={nextStep}
                prevStep={prevStep}
                />
        )
        default:
            return null
    }
}
export default FormSteps

Answer 1

Вы храните номер в вашем штате, а не объект. Попробуйте это:

const nextStep = () =>{
    setStep(v => v + 1)
}
const prevStep = ()=>{
    setStepv(v => v - 1)
}