Estoy tratando de crear una función que lleve al usuario a los pasos que no están deshabilitados y que omita los pasos deshabilitados.
Escribí el siguiente código, pero no se comporta como me gustaría.
Comportamiento esperado asumiendo que el paso actual es el Paso 5:
En el botón, haga clic en el paso 5 al paso 3 en el botón, haga clic en el paso 3 al paso 1
Pero actualmente el comportamiento es así:
En el botón, haga clic en Paso 5 a Paso 1
Quiero hacer que el bucle se detenga en el paso 3, intenté agregar un punto de interrupción, pero eso no lo resolvió, me estoy quedando sin ideas
const steps = [ { title: 'Step 1', id: 'stp1', disabled: false, }, { title: 'Step 2', id: 'stp2', disabled: true, }, { title: 'Step 3', id: 'stp3', disabled: false, }, { title: 'Step 4', id: 'stp4', disabled: true, }, { title: 'Step 5', id: 'stp5', disabled: false, }, ] const [currentStepIndex, setCurrentStepIndex] = useState(4); const getPreviousSelectableStep = () => { const steps = args.steps let stepIndex = currentStepIndex if ((stepIndex > 0) && steps[stepIndex - 1].disabled === true) { for (var i = steps.length - 1; i >= 0; i--) { if (steps[i].disabled === false) { setCurrentStepIndex(i) setCurrentStepId(steps[i].id) break } } } else if (stepIndex > 0) { setCurrentStepIndex(stepIndex - 1) setCurrentStepId(steps[stepIndex - 1].id) } }En su condición if , inicie el ciclo desde startIndex - 1 y no desde el final steps.length - 1 .
if (stepIndex > 0 && steps[stepIndex - 1].disabled === true) { for (var i = stepIndex - 1; i >= 0; i--) { if (steps[i].disabled === false) { setCurrentStepIndex(i); setCurrentStepId(steps[i].id); break; } } } else if (stepIndex > 0) { setCurrentStepIndex(stepIndex - 1); setCurrentStepId(steps[stepIndex - 1].id); }function getPrevStep(number) { let data = steps.filter(x => !x.disabled).reverse() return data[data.findIndex(x => x.id == "stp" + number) + 1] }