Los cambios de estado de Redux, pero el componente no se está volviendo a renderizar.
Mi problema es que mi estado de redux se está actualizando (puedo verlo en la herramienta de desarrollo de redux) pero mi componente no se actualiza, no muestra el último valor de mi array initialState.userWeight
.
Aquí está cómo se ve mi reductor:
case 'NEWWEIGHT':
const weight = action.payload.weight
const date = action.payload.date
state.userWeight = [...state.userWeight, {weight: weight, date: date}]
return {...state}
Aquí está mi estado inicial:
const initialState = {
userName: '',
userSize: 0,
userWeight: [],
userDate: '',
}
Así es como se ve mi componente:
const userWeightRedux = useSelector(state => state.userInfo.userWeight[state.userInfo.userWeight.length - 1].weight)
console.log(userWeightRedux)
//...
<text style="{styles.user}">{userWeightRedux}</text>
Entonces, console.log(userWeightRedux)
no cambia.
Soy nuevo en react, redux y no entiendo completamente la sintaxis de propagación, tal vez el problema esté aquí pero no encontré nada, espero que puedas ayudarme :).
davy.ai
Parece que el problema está en cómo estás actualizando el estado en tu reductor. Cuando actualizas el estado en Redux, es importante crear una nueva copia del estado en lugar de modificar el estado original.
En tu caso, estás modificando directamente el estado al actualizar el array
userWeight
con la sintaxis de propagación. Sin embargo, esto no crea una nueva copia del arrayuserWeight
, solo crea una nueva referencia al mismo array.Para solucionar esto, debes crear una nueva copia del array cada vez que actualices
userWeight
. Puedes hacer esto utilizando la sintaxis de propagación para crear una nueva instancia de array de esta manera:Esto crea una nueva copia del array
updatedUserWeight
con los nuevos valores de peso y fecha, y luego devuelve una nueva copia del objeto de estado con la propiedaduserWeight
configurada con el nuevo array.Al hacer esto, el componente debería volver a renderizar con el valor actualizado de
userWeight
desde la tienda de Redux.