Skip to content

Commit c27e717

Browse files
authored
Update src/content/reference/react-dom/flushSync.md
1 parent 61ea255 commit c27e717

File tree

1 file changed

+11
-2
lines changed

1 file changed

+11
-2
lines changed

src/content/reference/react-dom/flushSync.md

Lines changed: 11 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -138,14 +138,23 @@ Most of the time, `flushSync` can be avoided, so use `flushSync` as a last resor
138138

139139
### I'm getting an error: "flushSync was called from inside a lifecycle method" {/*im-getting-an-error-flushsync-was-called-from-inside-a-lifecycle-method*/}
140140

141-
You might get an error that says: `flushSync was called from inside a lifecycle method. React cannot flush when React is already rendering. Consider moving this call to a scheduler task or micro task.`
142141

143-
This happens when you call `flushSync` while React is already rendering, such as inside:
142+
React cannot `flushSync` in the middle of a render. If you call `flushSync` in render, it will noop and you'll see a warning:
143+
144+
<ConsoleBlock level="error">
145+
146+
Warning: flushSync was called from inside a lifecycle method. React cannot flush when React is already rendering. Consider moving this call to a scheduler task or micro task.
147+
148+
</ConsoleBlock level="error">
149+
150+
This can happen when you call `flushSync` inside:
144151

145152
- Class component lifecycle methods (`componentDidMount`, `componentDidUpdate`, etc.)
146153
- `useLayoutEffect` or `useEffect` hooks
147154
- During the render phase of a component
148155

156+
For example, if you call `flushSync` in an Effect:
157+
149158
```js {1-2,4-6}
150159
import { useEffect } from 'react';
151160
import { flushSync } from 'react-dom';

0 commit comments

Comments
 (0)