Al momento de consumir la api, el objeto DATA, llega correctamente. Como se ve por consola.
Pero luego al actualizar el navegador, sale el famoso error TypeError: Cannot read property 'map' of undefined y tambien deja de mostrar por consola el objeto que llega.
Cuando dentro de los Fragment comienzo con el mapeo del {results}=data. me tira el error.
Utilizo un Hook personalizado con axios para hacer la peticion a la api, que llega bien.
Es problema del hook personalizado? Estoy recorriendo mal el results?
Error completo ----> ×
TypeError: Cannot read property 'map' of undefined
Home
C:/Users/guido/Desktop/Proyectos/reactproyectos/comercio/src/components/Home/Home.js:14
11 | return ( <>
12 |
13 | <Container>
> 14 | <Row>
| ^ 15 |
16 | { results.map(({name,url}) =>(
17 |
View compiled
▶ 17 stack frames were collapsed.
Module.<anonymous>
C:/Users/guido/Desktop/Proyectos/reactproyectos/comercio/src/index.js:7
4 | import App from './App';
5 | import reportWebVitals from './reportWebVitals';
6 |
> 7 | ReactDOM.render(
8 | <React.StrictMode>
9 | <App />
10 | </React.StrictMode>,
View compiled
Module../src/index.js
http://localhost:3000/static/js/main.chunk.js:1230:30
__webpack_require__
C:/Users/guido/Desktop/Proyectos/reactproyectos/comercio/webpack/bootstrap:856
853 |
854 | __webpack_require__.$Refresh$.init();
855 | try {
> 856 | modules[moduleId].call(module.exports, module, module.exports, hotCreateRequire(moduleId));
| ^ 857 | } finally {
858 | __webpack_require__.$Refresh$.cleanup(moduleId);
859 | }
View compiled
fn
C:/Users/guido/Desktop/Proyectos/reactproyectos/comercio/webpack/bootstrap:150
147 | );
148 | hotCurrentParents = [];
149 | }
> 150 | return __webpack_require__(request);
| ^ 151 | };
152 | var ObjectFactory = function ObjectFactory(name) {
153 | return {
View compiled
1
http://localhost:3000/static/js/main.chunk.js:1488:18
__webpack_require__
C:/Users/guido/Desktop/Proyectos/reactproyectos/comercio/webpack/bootstrap:856
853 |
854 | __webpack_require__.$Refresh$.init();
855 | try {
> 856 | modules[moduleId].call(module.exports, module, module.exports, hotCreateRequire(moduleId));
| ^ 857 | } finally {
858 | __webpack_require__.$Refresh$.cleanup(moduleId);
859 | }
View compiled
checkDeferredModules
C:/Users/guido/Desktop/Proyectos/reactproyectos/comercio/webpack/bootstrap:45
42 | }
43 | if(fulfilled) {
44 | deferredModules.splice(i--, 1);
> 45 | result = __webpack_require__(__webpack_require__.s = deferredModule[0]);
| ^ 46 | }
47 | }
48 |
View compiled
Array.webpackJsonpCallback [as push]
C:/Users/guido/Desktop/Proyectos/reactproyectos/comercio/webpack/bootstrap:32
29 | deferredModules.push.apply(deferredModules, executeModules || []);
30 |
31 | // run deferred modules when all chunks ready
> 32 | return checkDeferredModules();
| ^ 33 | };
34 | function checkDeferredModules() {
35 | var result;
View compiled
(anonymous function)
http://localhost:3000/static/js/main.chunk.js:1:69
This screen is visible only in development. It will not appear if the app crashes in production.
Open your browser’s developer console to further inspect this error. Click the 'X' or hit ESC to dismiss this message.