-
Notifications
You must be signed in to change notification settings - Fork 48.6k
Make useEffect(async) warning more verbose #14327
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Conversation
2a53198
to
f9342ac
Compare
ReactDOM: size: 0.0%, gzip: -0.0% Details of bundled changes.Comparing: a7f270c...ea1a9f4 react-dom
react-art
react-native-renderer
react-test-renderer
react-reconciler
Generated by 🚫 dangerJS |
'supported, but you can call an async function inside an ' + | ||
'effect.' | ||
? '\n\nIt looks like you wrote useEffect(async () => ...) or returned a Promise. ' + | ||
'Instead, you may write an async function separately, ' + |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
no comma after separately please
'and then call it from inside the effect:\n\n' + | ||
'async function fetchComment(commentId) {\n' + | ||
' // You can await here\n' + | ||
'}\n\n' + |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
More of a question: would it be better to write this function inside the effect callback instead?
Supposedly, the engine would only have to evaluate the function declaration when the effect callback is called, but I'm not sure it'd help anyway as it'd still have to create the shared closure object.
At any rate, writing it outside the component entirely would definitely be better.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I don't really have an opinion on this but it's nice to show it doesn't have to be inside.
* Make useEffect(async) warning more verbose * Nit
* Make useEffect(async) warning more verbose * Nit
Is there a tracking bug for data fetching solution (possibly with error handling / timeout included)? Just being curious whether it will fit other use-cases too e.g Fetch API streaming body or Web Worker postMessage |
Adds a more detailed message. People still get tripped over this:
New message: