Welcome, Guest: Register On Nairaland / LOGIN! / Trending / Recent / NewStats: 3,162,115 members, 7,849,490 topics. Date: Monday, 03 June 2024 at 10:29 PM |
Nairaland Forum / Science/Technology / Programming / Guys, I Need Help With This Reactjs Issue Please. (2181 Views)
Reactjs Challenge - Fun Edition / Please I Need Help With This Reactjs Issue - Context Api & RTK (pictures) / Wordpress And Bbpress Issue, Please Help (2) (3) (4)
Guys, I Need Help With This Reactjs Issue Please. by Devdevdev(f): 10:08am On Nov 15, 2022 |
Hi guys. I've been trying to render information from an API but I keep getting errors. My goal is to render the information along with a button that changes the page once clicked. The information is an object that has an array of objects within it. Below is the screenshot of the code along with sreenshot of the data I want to fetch. I want to be able to render all the information from the data within the h2 tags. With arrays, it's straightforward cos all I have to do is map the data from the users but with objects it is more complicated. Please I'll really appreciate if anyone can provide some help
|
Re: Guys, I Need Help With This Reactjs Issue Please. by Devdevdev(f): 10:13am On Nov 15, 2022 |
If you can also give me advice on how to make my code cleaner I'll appreciate. |
Re: Guys, I Need Help With This Reactjs Issue Please. by niel63(m): 10:22am On Nov 15, 2022 |
Devdevdev: You can do whatever you could with an array with an object too. Or atleast, most. You can map through an object too. So many method to choose from, depending on your use case. You're already doing well. Here's a pointer. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object |
Re: Guys, I Need Help With This Reactjs Issue Please. by tensazangetsu20(m): 10:23am On Nov 15, 2022 |
You can convert objects to an array and then map. Use object.values to get the value within the object flatten it out and then map it. 1 Like |
Re: Guys, I Need Help With This Reactjs Issue Please. by niel63(m): 10:25am On Nov 15, 2022 |
You can map through a deeply nested object... even those contained within an array in your objects. You'd find it more interesting working with objects after reading the above MDN reference above. That's the best advice I can give you. You won't forget anything you read and implement yourself. |
Re: Guys, I Need Help With This Reactjs Issue Please. by chukwuebuka65(m): 11:38am On Nov 15, 2022 |
Devdevdev: I thought you said you have mastered everything about the frontend? Your response is an array, get it from “res.data.results “ . Our bosses above, una no dey code in react js abi una no want read the code. Why una dey talk about object.values and deeply nested objects. 1 Like |
Re: Guys, I Need Help With This Reactjs Issue Please. by LikeAking: 11:47am On Nov 15, 2022 |
Devdevdev: Use array.map... { array. map(()=> } You never map the user array.. Also check ya handle pagination function, their is an error on the last line.. |
Re: Guys, I Need Help With This Reactjs Issue Please. by Devdevdev(f): 11:55am On Nov 15, 2022 |
Niel63 and tensazangetsu20 thanks. I finally figured it out and rendered the data. Also, the pagination worked perfectly. Thanks guys.
|
Re: Guys, I Need Help With This Reactjs Issue Please. by chukwuebuka65(m): 12:05pm On Nov 15, 2022 |
Devdevdev: This is bad code. Your users is now an array inside another array, whereas you could have gotten your data from “res.data.results “. |
Re: Guys, I Need Help With This Reactjs Issue Please. by Devdevdev(f): 12:11pm On Nov 15, 2022 |
chukwuebuka65: Tensazangetsu20, neil63 can you tell this dude that what he is says is wrong? If I tell him myself he won't agree. 2 Likes 1 Share |
Re: Guys, I Need Help With This Reactjs Issue Please. by Devdevdev(f): 12:30pm On Nov 15, 2022 |
chukwuebuka65: I never said I had mastered front end. I only started learning programming in September. |
Re: Guys, I Need Help With This Reactjs Issue Please. by Devdevdev(f): 12:40pm On Nov 15, 2022 |
chukwuebuka65: What you are suggesting only works if it's a simple object such as this: {"Firstname": Brenda, "Lastname": Colby} With this I wouldn't have needed to map anything. I would have just typed <h2>{users.firstname}</h2> It won't work for the kind of object I was retrieving data from, that had nested arrays and objects. |
Re: Guys, I Need Help With This Reactjs Issue Please. by niel63(m): 12:51pm On Nov 15, 2022 |
chukwuebuka65: Have you heard of the term. All codes are garbage? We don't use words like "bad code"... as bad as it might seem to you, it's still a piece of code. That's why we have different cadres in software engineering. You can point her to refactoring. But one thing you should know is, we all write dirty codes when we are still grasping on the concepts. No bad codes bro! If it works, refactor if you can or have a senior review your codebase. 3 Likes 1 Share |
Re: Guys, I Need Help With This Reactjs Issue Please. by chukwuebuka65(m): 1:03pm On Nov 15, 2022 |
Devdevdev: Ok you win |
Re: Guys, I Need Help With This Reactjs Issue Please. by niel63(m): 1:08pm On Nov 15, 2022 |
chukwuebuka65: Even for SO, if you ask some kind question, we go refer you to references that could help you. I no read the code but her complaint sounded familiar, so I had to point her to a learning point. If she sabi wetin she fit do with her object, she go dey better position to choose wetin go work for her. You see how she use the "then()" I hate that then then then then... in an asynchronous function. I like to await instead. So you see, it is better to know, then choose than to know just one approach. Axios is bae but, you see normal fetch ehn, I no dey use am play. Na my style be that. So everybody with him own jollof 2 Likes |
Re: Guys, I Need Help With This Reactjs Issue Please. by chukwuebuka65(m): 1:17pm On Nov 15, 2022 |
niel63:. Bro, a bad code is bad code. If you write a code that is suppose to execute in 1s , to execute in 10s. That’s not an efficient code. In this case , running objects.values on object with many properties will convert the object into an array of arrays which takes a torn on the cpu which would have been avoided. This is why we learn algorithms, to write efficient code and not just code that works. 1 Like |
Re: Guys, I Need Help With This Reactjs Issue Please. by niel63(m): 1:44pm On Nov 15, 2022 |
chukwuebuka65: Shebi you realise say me and you dey talk the same thing. Talking about DSA way of thinking is not a bad idea. But for an entry level dev. All you need do is, put em through the paths. Explain what makes their approach a bad one since you know most start with YouTube videos and stuffs. "In chief's voice" - "my people would say, when a market woman goes round the market and see her shop is open, she will shout... what is this... help me help me." The above, is not supposed to make any sense if you get what I mean. If na me write code wey u say bad, omo, I go follow you up to know how best I can make it better. And that's because I know better. You get? |
Re: Guys, I Need Help With This Reactjs Issue Please. by Hannania(m): 2:13pm On Nov 15, 2022 |
Devdevdev:Working with APIs is great. When you're ready to deploy your App, please don't use console.log. It's a bad practice. You can refactor the Api call to catch an error and return it. 1 Like |
Re: Guys, I Need Help With This Reactjs Issue Please. by Nobody: 2:26pm On Nov 15, 2022 |
Suddenly people with 50 IQ score helping out a genius with 160+ IQ score with the very basics... What's the point using axios and async when u still had to type that long notes.. Why not use await and make your code shorter.. It's Sha simple... I bet u don't even know what fetch means. Jumping from step A-Z
|
Re: Guys, I Need Help With This Reactjs Issue Please. by LikeAking: 2:30pm On Nov 15, 2022 |
Una too like vawulence... |
Re: Guys, I Need Help With This Reactjs Issue Please. by Devdevdev(f): 2:33pm On Nov 15, 2022 |
Hannania: I actually forgot to remove it. Thanks though. |
Re: Guys, I Need Help With This Reactjs Issue Please. by Devdevdev(f): 3:08pm On Nov 15, 2022 |
GREATIGBOMAN: I know what fetch means. I saw your silly comment and rewrote the code using just fetch. I also added a loading state.
|
Re: Guys, I Need Help With This Reactjs Issue Please. by Devdevdev(f): 3:10pm On Nov 15, 2022 |
Hannania: I just rewrote the code using just fetch. Anything I can improve on my code? I'll appreciate your response. Screenshot is below.
|
Re: Guys, I Need Help With This Reactjs Issue Please. by Nobody: 3:18pm On Nov 15, 2022 |
Devdevdev: Google is surely ur friend. Easy to know u just used fast google to type that shiit |
Re: Guys, I Need Help With This Reactjs Issue Please. by Devdevdev(f): 3:26pm On Nov 15, 2022 |
GREATIGBOMAN: I didn't Google anything. I already learned how to use fetch, long before I learned how to use axios. |
Re: Guys, I Need Help With This Reactjs Issue Please. by Nobody: 3:31pm On Nov 15, 2022 |
Devdevdev: No Mr transgendered. ur code and the answer here looks same. https://stackoverflow.com/questions/66507362/react-async-and-await-not-working-with-fetch Also... there's nothing wrong with using google as a Dev
|
Re: Guys, I Need Help With This Reactjs Issue Please. by Devdevdev(f): 3:37pm On Nov 15, 2022 |
GREATIGBOMAN: It's obvious you are a fool. How does any answer in that link resemble mine? You aren't just a fool you are clearly one with an eye defect. What about the loading state? How did I learn to include a loading state in fetch if I didn't know fetch already? Why are you so pained that I rewrote my code using something you said I couldn't use? Lol. Abeg shift make I see road. 1 Like 1 Share |
Re: Guys, I Need Help With This Reactjs Issue Please. by Nobody: 3:39pm On Nov 15, 2022 |
Devdevdev: I can't believe u don't like it when someone does detective work on u. |
Re: Guys, I Need Help With This Reactjs Issue Please. by Devdevdev(f): 3:40pm On Nov 15, 2022 |
GREATIGBOMAN: Detective lol. You aren't half as smart as you think you are. Rest abeg. |
Re: Guys, I Need Help With This Reactjs Issue Please. by chukwuebuka65(m): 3:43pm On Nov 15, 2022 |
niel63: Ok but the lady in question is not ready to learn. She didn’t even try what I suggested to her. She just rush to come and insult me. The journey of programming is a long one. I wonder how she will get far with this attitude. 5 Likes |
Re: Guys, I Need Help With This Reactjs Issue Please. by Nobody: 3:44pm On Nov 15, 2022 |
Re: Guys, I Need Help With This Reactjs Issue Please. by Nobody: 3:47pm On Nov 15, 2022 |
chukwuebuka65: The SheMale_ is obviously a bitter person. Imagine how it was busy trying to correct u instead without even knowing what it was talking about. Proud degenerate. That person is not a lady. transgendered take note. 1 Like |
One Forum Script I Am Renovating / Data Science/analysis Roadmap / New In The Programming World?
(Go Up)
Sections: politics (1) business autos (1) jobs (1) career education (1) romance computers phones travel sports fashion health religion celebs tv-movies music-radio literature webmasters programming techmarket Links: (1) (2) (3) (4) (5) (6) (7) (8) (9) (10) Nairaland - Copyright © 2005 - 2024 Oluwaseun Osewa. All rights reserved. See How To Advertise. 54 |