Estoy creando una aplicación simple para jugar con Redux ToolKit y reaccionar; sin embargo, puedo ver el objeto en la pestaña cromada redux, pero no puedo acceder a él a través de componentes que usan ganchos de reacción.

mi rebanada:

 import { createSlice, createSelector, createAsyncThunk, } from "@reduxjs/toolkit"; const initialState = { cryptoList: [], loading: false, hasErrors: false, }; export const getCryptos = createAsyncThunk("cryptos/get", async (thunkAPI) => { try { const cryptosUrl = "https://api.coingecko.com/api/v3/coins/markets?vs_currency=usd"; let response = await fetch(cryptosUrl); console.log(response); return await response.json(); } catch (error) { console.log(error); } }); const cryptoSlice = createSlice({ name: "cryptos", initialState, reducers: {}, extraReducers: (builder) => { builder.addCase(getCryptos.pending, (state) => { state.loading = true; }); builder.addCase(getCryptos.fulfilled, (state, { payload }) => { state.loading = false; state.cryptoList = payload; }); builder.addCase(getCryptos.rejected, (state, action) => { state.loading = false; state.hasErrors = action.error.message; }); }, }); export const selectCryptos = createSelector( (state) => ({ cryptoList: state.cryptoList, loading: state.loading, }), (state) => state ); export default cryptoSlice;

Mi componente:

 import React, { useEffect } from "react"; import { getCryptos, selectCryptos } from "./cryptoSlice"; import { useSelector, useDispatch } from "react-redux"; const CryptoComponent = () => { const dispatch = useDispatch(); const { cryptoList, loading, hasErrors } = useSelector(selectCryptos); useEffect(() => { dispatch(getCryptos()); }, [dispatch]); const renderCrypto = () => { if (loading) return <p>Loading Crypto...</p>; if (hasErrors) return <p>Error loading news...</p>; if (cryptoList) { return cryptoList.data.map((crypto) => <p> {crypto.id}</p>); } }; return ( <div className="container"> <div className="row">CryptoComponent: {renderCrypto()}</div> </div> ); }; export default CryptoComponent;

Todos los valores construidos del estado: cryptoList, loading, hasErrors, parecen no estar definidos a nivel de componente.

¡Cualquier sugerencia es apreciada!