Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

142
Vistas
Establecer el estado del reductor de reacción devuelve el valor adecuado pero no provoca que se vuelva a procesar

Acabo de implementar reductores para mi visualizador de algoritmo de clasificación y estoy tratando de establecer el estado de mi matriz para que sea el resultado de un algoritmo de clasificación. Estoy 99% seguro de que mi reductor recibe la matriz ordenada y luego la devuelve (porque hice algunos registros de consola), y también estoy bastante seguro de que la variable en sí cambia.

Aquí está mi reductor y variable de matriz (* tenga en cuenta que los valores serán una matriz en la función):

 export const ACTIONS = { SET_VALUES: 'set-values' } function reducer(state, action) { switch (action.type) { case ACTIONS.SET_VALUES: console.log(action.payload.values) return action.payload.values default: return state } } const [values, dispatch] = useReducer(reducer, [])

Y aquí está el algoritmo de clasificación donde se llama al envío:

 export function bubbleSort(array, dispatch) { var testArray = array console.log('sorting') var sorted = false while (!sorted) { var changed = false; for (var i = 0; i < testArray.length-1; i++) { if (testArray[i] > testArray[i+1]) { changed = true; var smaller = testArray[i] testArray[i] = testArray[i+1] testArray[i+1] = smaller } } if (!changed) { sorted = true } } dispatch({ type: ACTIONS.SET_VALUES, payload: { values: testArray}}) console.log('sorted') console.log(array) }

Al imprimir la matriz original (valores) pasada a la función, se ordena. Sin embargo, las barras en la pantalla que reflejan la matriz en sí no cambian, lo que me lleva a creer que no se está produciendo una nueva representación y que las barras están usando un estado antiguo de la variable (valores). ¿Alguien sabe cómo arreglar esto?

about 4 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

Tenías casi todo correcto. El problema era que React usa la igualdad referencial a===b para verificar si algo ha cambiado. Entonces, dado que ordenó la matriz en su lugar, la referencia no cambió, por lo que toda la sierra de gancho useReducer es ese state===state , por lo que no se volvió a procesar.

Todo lo que cambié fue crear una nueva matriz al comienzo de la ordenación de burbujas para que no se mutara.

var testArray = array.slice();

 const { useReducer } = React; const ACTIONS = { SET_VALUES: "set-values", }; function reducer(state, action) { switch (action.type) { case ACTIONS.SET_VALUES: console.log(action.payload.values); return action.payload.values; default: return state; } } function bubbleSort(array, dispatch) { var testArray = array.slice(); console.log("sorting"); var sorted = false; while (!sorted) { var changed = false; for (var i = 0; i < testArray.length - 1; i++) { if (testArray[i] > testArray[i + 1]) { changed = true; var smaller = testArray[i]; testArray[i] = testArray[i + 1]; testArray[i + 1] = smaller; } } if (!changed) { sorted = true; } } dispatch({ type: ACTIONS.SET_VALUES, payload: { values: testArray } }); console.log("sorted"); console.log(array); } const App = () => { const [values, dispatch] = useReducer(reducer, [5, 2, 3, 9, 10, 234, 432, 1]); return ( <div> <button onClick={() => { bubbleSort(values, dispatch); }} >Sort</button> <div>{values.join(", ")}</div> </div> ); }; ReactDOM.render(<App/>, document.getElementById("root"));
 <script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.8.3/umd/react.production.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.8.3/umd/react-dom.production.min.js"></script> <div id="root"/>

about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda