Entonces, estoy tratando de obtener el estado de la tienda de aplicaciones y pasarlo a mi componente para renderizar, uno de esos problemas que tengo es que parece no saber el estado inicial del estado específico que estoy tratando de usar, por ejemplo, si el estado ya se cargó (la acción se envió y devolvió datos de la API), entonces esto funciona bien, sin embargo, en una carga nueva donde la acción aún no se ha enviado, parece que el estado no está definido, he intentado algunas cosas diferentes para establecer el estado inicialmente pero aparentemente no funciona, no importa lo que haga, el estado parece estar indefinido en una carga nueva. En mi tienda tengo esto:

 const votdFromStorage = localStorage.getItem("votd") ? JSON.parse(localStorage.getItem("votd")) : { votd: { bible: "", verse: [], passage: "", chapter: "" } }; const initialState = { // verse of the day votd: votdFromStorage, };

Esto dice para ver si ya existe un elemento en localStorage y si lo devuelve, de lo contrario, devuelve un objeto que tiene algunos valores iniciales, el error que recibo específicamente es que no puede leer la bible de indefinido. Y recibo este error aquí en mi componente de inicio

 const dispatch = useDispatch(); const { votd: { bible, passage, verse, chapter }, loading, } = useSelector((state) => state.votd); useEffect(() => { dispatch({ type: VOTD_REQUEST }); dispatch(verseOfTheDay()); }, [dispatch]);

Aquí estoy usando el gancho useSelector para tomar del estado el objeto votd . de los cuales, no puede encontrar la bible , supongo que tampoco podría encontrar los otros valores, pero la bible es la primera. De todos modos, creo que el problema es cómo configuro initial state del objeto votd, incluso traté de configurar el estado de init dentro del reducer similar al que ves en la tienda, pero aún devuelve el mismo error.

aquí está el reductor:

 export const votdReducer = (state = {}, action) => { switch (action.type) { case VOTD_REQUEST: return { ...state, loading: true }; case VOTD_SUCCESS: return { loading: false, votd: action.payload }; case VOTD_FAIL: return { ...state, loading: false, error: action.payload }; default: return state; } };

también para ayudar aquí está el estado inicial establecido en la store

 const initialState = { // verse of the day votd: votdFromStorage, };