Actualización del Estado con useDispatch

Para cambiar el estado en Redux, se envía una acción al store. Esto se realiza utilizando el hook useDispatch.

Despachando una acción

Dentro de un componente, se llama a useDispatch y se utiliza para disparar acciones:

import { useDispatch } from 'react-redux';
import { increment } from './counterSlice';

function Counter() {
  const dispatch = useDispatch();

  return (
    <button onClick={() => dispatch(increment())}>
      Increase
    </button>
  );
}

Cuando se hace clic en el botón, la acción se envía al store y el estado se actualiza.

Cómo funciona

No se actualiza el estado directamente. En su lugar, se despacha una acción y Redux decide cómo debe cambiar el estado utilizando los reducers.

Este enfoque mantiene las actualizaciones de estado predecibles. Todos los cambios siguen el mismo flujo, lo que facilita la comprensión y depuración de la aplicación.