Node + React Async Function Not Returning Properly

Question: I’m trying to render the result of the replit database in react, pulled from node. However, I’m only getting ‘[object Promise]’. How do I fix this?

I want it to display the value of the repl database keys

Repl link: https://replit.com/@SevenT33N/contact-form-again?v=1

1 Like

It seems like you’re trying to render asynchronously,
I don’t use React or Next, but I would assume you may have to make the sync part first, and then use an effect to load this,

If that doesn’t work, and you’re fine with using a faster and more simple async supporting alternative, try ChubML with Susha, which comes bundled in Asri

1 Like

You defined listDatabaseKeys function as an async that fetches data from the database, which is fine, but the problem is that you’re not waiting for this data to be fetched before rendering your component. When you call listDatabaseKeys() in your app.get('/') route, it returns a Promise, and the actual data fetching happens asynchronously.

Another thing is that you’re exporting arrayResult right after calling the listDatabaseKeys, and again, you’re not waiting for the promise to resolve, hence, you’re exporting a promise and not the actual data.

And since arrayResult is a Promise, the React tries to render the Promise object, which will cause the [object Promise] output.

Fix those things and it will solve your issue.

4 Likes

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.