The Firebase query I have created is working perfectly fine as it returns the correct data. I have access to the correct information, but my table is not displaying the data because the function getUsers() is not running by default or even a page refresh. I am still new with React js, so take it easy on me please lol

The Firebase query I have created is working perfectly fine as it returns the correct data. I have access to the correct information, but my table is not displaying the data because the function getUsers() is not running by default or even a page refresh. I am still new with React js, so take it easy on me please lol

• javascript
• reactjs
• use-effect

• Do you put those useEffect after the return statement? – kunquan Commented Jan 30, 2021 at 21:34
• UseEffect and useState should be at the top level. I think the function getUsers is also wrong. setDetails(obj) should be outside the foreach function getUsers () { query.forEach() { your code} } – jShubh Commented Jan 30, 2021 at 21:42
• function getUsers () { query.forEach() { your code} setDetails(obj) } }` – jShubh Commented Jan 30, 2021 at 21:49
• 1 Please don't post screenshots of your code, or other textual content. Instead post the actual text, and use the formatting tools of Stack Overflow to mark it up. – Frank van Puffelen Commented Jan 30, 2021 at 21:55
• Hi, will do that in the future my apologies. The problem was that the setDetails() was in the wrong place lol – CodingBoy Commented Jan 30, 2021 at 22:16

2 Answers 2

Try

useEffect(() => getUsers(),[Details]);

Adding your state as the dependency should allow it run every time the state changes

The useEffect hook with an empty dependency array will only run in the onMount lifecycle phase of the ponent, that means only once. If you want it to run on every render, remove the dependency array like:

useEffect(() => getUsers());