How to go through the data of this element

Asked

Viewed 118 times

0

I have the following data element stored in a vector called Repositorios = []

(2) [{…},{…}]
0: rocketseat: Array(30)0: {name: "academy-facebook-auth", description: null, login: "Rocketseat"
}description: nulllogin: "Rocketseat"name: "academy-facebook-auth"__proto__: Object1: {name: "academy-ssr-nextjs", description: "Código do curso de SSR com NextJS no Academy", login: "Rocketseat"
}2: {name: "academy-websocket", description: null, login: "Rocketseat"
}3: {name: "academy-websocket-facebook", description: null, login: "Rocketseat"
}4: {name: "adonis-acl", description: "demo app: https://github.com/enniel/adonis-acl-blog-demo", login: "Rocketseat"
}5: {name: "adonis-bull", description: "The easiest way to start using an asynchronous job queue with AdonisJS ⚡️", login: "Rocketseat"
}6: {name: "adonis-timezone", description: "Timezone provider for the Adonis framework", login: "Rocketseat"
}7: {name: "ambiente-react-native", description: "Antigo guia de Ambiente React Native", login: "Rocketseat"
}8: {name: "awesome", description: "Uma lista dos materiais gratuitos diponibilizados …incluindo conteúdos do Blog, Youtube e Instagram.", login: "Rocketseat"
}9: {name: "blog-adonis-reactjs-react-native-airbnb", description: "API developed in the series of post about recreati…b interface with AdonisJS, ReactJS e React Native", login: "Rocketseat"
}10: {name: "blog-adonis-reactjs-react-native-airbnb-app", description: "React Native app developed in the series about recreating the Airbnb interface", login: "Rocketseat"
}11: {name: "blog-adonis-reactjs-react-native-airbnb-web", description: "ReactJS app developed in the series about recreating the Airbnb interface", login: "Rocketseat"
}12: {name: "blog-auth-rn-node-backend", description: "Project created in the blog post about JWT auth in React Native using Node.js API", login: "Rocketseat"
}13: {name: "blog-express-middlewares", description: "Blog post about middlewares on express", login: "Rocketseat"
}14: {name: "blog-express-sequelize", description: "Project created in the post about Sequelize in NodeJS with ExpressJS", login: "Rocketseat"
}15: {name: "blog-native-base", description: "Project created for the blog post about Native Base in React Native", login: "Rocketseat"
}16: {name: "blog-react-material-ui", description: "Project created in the post about Material UI in ReactJS", login: "Rocketseat"
}17: {name: "blog-react-native-camera", description: "Blog post about image upload and camera use in React Native", login: "Rocketseat"
}18: {name: "blog-react-native-deep-linking", description: "Project created for the "Deep Linking no React Native" post", login: "Rocketseat"
}19: {name: "blog-react-native-map", description: "Project created for the blog post about Mapbox in React Native", login: "Rocketseat"
}20: {name: "blog-react-native-shimmer-effect", description: "Project created for the blog post about Shimmer Effect in React Native", login: "Rocketseat"
}21: {name: "blog-react-native-template", description: "Project created for the post "Criando template de React Native"", login: "Rocketseat"
}22: {name: "blog-react-navigation", description: null, login: "Rocketseat"
}23: {name: "blog-scroll-infinito-react-native", description: "Project created for the "Scroll Infinito no React Native" post", login: "Rocketseat"
}24: {name: "blog-testando-emails-mailhog", description: "Código do post "Testando envio de e-mails no Node utilizando Mailhog" no Blog da Rocketseat", login: "Rocketseat"
}25: {name: "bootcamp-gostack-01", description: "Código do primeiro módulo do Bootcamp GoStack ", login: "Rocketseat"
}26: {name: "bootcamp-gostack-02", description: "Código do segundo módulo do Bootcamp GoStack ", login: "Rocketseat"
}27: {name: "bootcamp-gostack-03", description: "Código do terceiro módulo do Bootcamp GoStack ", login: "Rocketseat"
}28: {name: "bootcamp-gostack-04", description: "Código do quarto módulo do Bootcamp GoStack ", login: "Rocketseat"
}29: {name: "bootcamp-gostack-05", description: "Código do quinto módulo do Bootcamp GoStack ", login: "Rocketseat"
}
1: {alura-cursos: Array(30)}
.....

I am creating an element with createTextNode and defining a text for it, I need to assign the name property to that element, however I can’t go through this vector

    const inputText = this.inputEl.value;

        if(inputText.length === 0)
            return;

        const response = await api.get(`/users/${inputText}/repos`);

        const mapped = response.data.map(repo => ({
            name: repo.name,
            description: repo.description,
            login: repo.owner.login
        }));

        repoUser[inputText] = mapped;

        this.repositories.push(repoUser);
        console.log(this.repositories);

        this.inputEl.value = "";
        this.render();
        // this.save();
    }
render() {
        this.project.innerHTML = '';

        // Criar a grade dos elementos
        let repos = document.createElement('div');
        repos.classList.add("repos");

        this.project.appendChild(repos)

        // let i = 0;
        this.repositories.forEach(function(repo) {
            // console.log(this.repositories.length)
            // while(i < this.repositories.length){
                let titleElement = document.createElement('h1');
                titleElement.appendChild(document.createTextNode(repo.login))

                repos.appendChild(titleElement);

                // Container dos itens
                let itemElement = document.createElement('div');
                itemElement.classList.add('repo-item');

                let titleItemElement = document.createElement('h3');
                titleItemElement.appendChild(document.createTextNode(toString(repo.name)));
                console.log(titleItemElement)
                // i++;
            // }

what happens is that I can’t go through this array nor access its properties.

  • repositorios[0]['repositorios'] maybe so, but, I’m not sure it got cut.

  • @Virgilionovic sorry it got cut up so I could fix it

  • Console.log from json got weird but, I think that’s it.

  • @Virgilionovic managed to solve +- the moment I perform the first query in the API displays everything cute, the second time appears the following error (could give me a north) code&#xA;main.js:117 Uncaught (in promise) TypeError: Cannot read property 'forEach' of undefined&#xA; at eval (main.js:117)&#xA; at Array.forEach (<anonymous>)&#xA; at App.render (main.js:112)&#xA;

No answers

Browser other questions tagged

You are not signed in. Login or sign up in order to post.