Skip to content

Commit d97ce4a

Browse files
authored
Merge pull request #979 from reactjs/tr/flushSync-fix
Translated the untranslated part of flushSync.md
2 parents 7c70523 + 28889c4 commit d97ce4a

1 file changed

Lines changed: 12 additions & 12 deletions

File tree

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

Lines changed: 12 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -134,26 +134,26 @@ export default function PrintApp() {
134134

135135
---
136136

137-
## Troubleshooting {/*troubleshooting*/}
137+
## トラブルシューティング {/*troubleshooting*/}
138138

139-
### 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*/}
139+
### "flushSync was called from inside a lifecycle method" というエラーが出る {/*im-getting-an-error-flushsync-was-called-from-inside-a-lifecycle-method*/}
140140

141141

142-
React cannot `flushSync` in the middle of a render. If you do, it will noop and warn:
142+
React はレンダー中に `flushSync` を実行できません。実行した場合、`flushSync` は何も行わず、以下の警告を表示します。
143143

144144
<ConsoleBlock level="error">
145145

146146
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.
147147

148148
</ConsoleBlock>
149149

150-
This includes calling `flushSync` inside:
150+
これには、以下の場所で `flushSync` を呼び出す場合が含まれます。
151151

152-
- rendering a component.
153-
- `useLayoutEffect` or `useEffect` hooks.
154-
- Class component lifecycle methods.
152+
- コンポーネントのレンダー中。
153+
- `useLayoutEffect` または `useEffect` フック内。
154+
- クラスコンポーネントのライフサイクルメソッド内。
155155

156-
For example, calling `flushSync` in an Effect will noop and warn:
156+
例えば、エフェクト内で `flushSync` を呼び出すと、`flushSync` は何も行わず、警告を表示します。
157157

158158
```js
159159
import { useEffect } from 'react';
@@ -171,7 +171,7 @@ function MyComponent() {
171171
}
172172
```
173173

174-
To fix this, you usually want to move the `flushSync` call to an event:
174+
これを修正するには、通常、`flushSync` の呼び出しをイベントに移します。
175175

176176
```js
177177
function handleClick() {
@@ -183,7 +183,7 @@ function handleClick() {
183183
```
184184

185185

186-
If it's difficult to move to an event, you can defer `flushSync` in a microtask:
186+
イベントへの移動が難しい場合は、マイクロタスク内で `flushSync` の実行を遅らせることが可能です。
187187

188188
```js {3,7}
189189
useEffect(() => {
@@ -196,10 +196,10 @@ useEffect(() => {
196196
}, []);
197197
```
198198

199-
This will allow the current render to finish and schedule another syncronous render to flush the updates.
199+
これにより、現在のレンダーを完了させたうえで、更新をフラッシュするための別の同期レンダーをスケジュールできます。
200200

201201
<Pitfall>
202202

203-
`flushSync` can significantly hurt performance, but this particular pattern is even worse for performance. Exhaust all other options before calling `flushSync` in a microtask as an escape hatch.
203+
`flushSync` はパフォーマンスを大幅に低下させる可能性がありますが、このパターンではパフォーマンスへの悪影響がさらに大きくなります。マイクロタスク内で `flushSync` を避難ハッチとして呼び出す前に、まず他のあらゆる選択肢を試してください。
204204

205205
</Pitfall>

0 commit comments

Comments
 (0)