Skip to content

Commit ba882f3

Browse files
committed
Resolve conflicts
1 parent 725b63c commit ba882f3

File tree

6 files changed

+5
-34
lines changed

6 files changed

+5
-34
lines changed

src/content/learn/conditional-rendering.md

Lines changed: 2 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -52,11 +52,7 @@ export default function PackingList() {
5252
5353
</Sandpack>
5454
55-
<<<<<<< HEAD
56-
複数の `Item` コンポーネントのうち一部のみで、props である `isPacked` が `false` ではなく `true` になっていることに注意してください。目的は、`isPacked={true}` の場合にのみチェックマーク (✔) を表示させることです。
57-
=======
58-
Notice that some of the `Item` components have their `isPacked` prop set to `true` instead of `false`. You want to add a checkmark (✅) to packed items if `isPacked={true}`.
59-
>>>>>>> 0f2284ddc8dcab8bbb9b42c04f3c7af94b5b2e73
55+
複数の `Item` コンポーネントのうち一部のみで、props である `isPacked` が `false` ではなく `true` になっていることに注意してください。目的は、`isPacked={true}` の場合にのみチェックマーク (✅) を表示させることです。
6056
6157
これは [`if`/`else` 文](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/if...else)を使って、以下のように書くことができます。
6258
@@ -206,11 +202,7 @@ return (
206202
);
207203
```
208204
209-
<<<<<<< HEAD
210-
これは「*`isPacked` が true なら `name + ''` をレンダーし、それ以外 (`:`) の場合は `name` をレンダーする*」というように読んでください。
211-
=======
212-
You can read it as *"if `isPacked` is true, then (`?`) render `name + ''`, otherwise (`:`) render `name`"*.
213-
>>>>>>> 0f2284ddc8dcab8bbb9b42c04f3c7af94b5b2e73
205+
これは「*`isPacked` が true なら `name + ''` をレンダーし、それ以外 (`:`) の場合は `name` をレンダーする*」というように読んでください。
214206
215207
<DeepDive>
216208

src/content/learn/you-might-not-need-an-effect.md

Lines changed: 1 addition & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -408,15 +408,9 @@ function Game() {
408408
409409
このコードには 2 つの問題があります。
410410
411-
<<<<<<< HEAD
412411
1 つ目の問題は、非常に効率が悪いことです。コンポーネント(およびその子)は、連鎖内の各 `set` コールの間で毎回再レンダーする必要があります。上記の例では、最悪の場合、下位のツリーに 3 回の不要な再レンダー(`setCard` → レンダー → `setGoldCardCount` → レンダー → `setRound` → レンダー → `setIsGameOver` → レンダー)が発生することになります。
413412
414-
たとえこれが遅くなかったとしても、コードが発展するにつれ、書いた「チェイン」が新しい要件に適合しないケースが出てきます。例えばゲームの手順を遡る機能を追加しているとしましょう。このためには、各 state 変数を過去のある時点の値に再セットしていくことになります。しかし過去の値から `card` の state をセットした時点で再びエフェクトの連鎖処理がトリガされ、表示されるデータが変更されてしまいます。このようなコードは、硬直的で壊れやすいものです。
415-
=======
416-
First problem is that it is very inefficient: the component (and its children) have to re-render between each `set` call in the chain. In the example above, in the worst case (`setCard` → render → `setGoldCardCount` → render → `setRound` → render → `setIsGameOver` → render) there are three unnecessary re-renders of the tree below.
417-
418-
The second problem is that even if it weren't slow, as your code evolves, you will run into cases where the "chain" you wrote doesn't fit the new requirements. Imagine you are adding a way to step through the history of the game moves. You'd do it by updating each state variable to a value from the past. However, setting the `card` state to a value from the past would trigger the Effect chain again and change the data you're showing. Such code is often rigid and fragile.
419-
>>>>>>> 0f2284ddc8dcab8bbb9b42c04f3c7af94b5b2e73
413+
2 つ目の問題は、たとえこれが遅くなかったとしても、コードが発展するにつれ、書いた「チェイン」が新しい要件に適合しないケースが出てくるということです。例えばゲームの手順を遡る機能を追加しているとしましょう。このためには、各 state 変数を過去のある時点の値に再セットしていくことになります。しかし過去の値から `card` の state をセットした時点で再びエフェクトの連鎖処理がトリガされ、表示されるデータが変更されてしまいます。このようなコードは、硬直的で壊れやすいものです。
420414
421415
このような場合、レンダー中に計算できるものはそこで行い、イベントハンドラで state の調整を終わらせる方が良いでしょう。
422416

src/content/reference/react-dom/components/index.md

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -34,11 +34,7 @@ React は、ブラウザ組み込みのすべての [HTML](https://developer.moz
3434

3535
## リソース・メタデータ関連コンポーネント {/*resource-and-metadata-components*/}
3636

37-
<<<<<<< HEAD
3837
以下のブラウザ組み込みコンポーネントを用いて、外部リソースを読み込んだり、ドキュメントにメタデータを付与したりすることができます。
39-
=======
40-
These built-in browser components let you load external resources or annotate the document with metadata:
41-
>>>>>>> 0f2284ddc8dcab8bbb9b42c04f3c7af94b5b2e73
4238

4339
* [`<link>`](/reference/react-dom/components/link)
4440
* [`<meta>`](/reference/react-dom/components/meta)

src/content/reference/react/index.md

Lines changed: 0 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -14,17 +14,10 @@ React リファレンスは機能別にいくつかのサブセクションに
1414

1515
プログラムから利用する React の機能です。
1616

17-
<<<<<<< HEAD
1817
* [フック](/reference/react/hooks) - コンポーネント内から使用する様々な React の機能
1918
* [コンポーネント](/reference/react/components) - JSX 内で用いる組み込みコンポーネント
2019
* [API](/reference/react/apis) - コンポーネントの定義に用いる API
2120
* [ディレクティブ](/reference/rsc/directives) - React Server Components 互換のバンドラに与えるための指示情報
22-
=======
23-
* [Hooks](/reference/react/hooks) - Use different React features from your components.
24-
* [Components](/reference/react/components) - Built-in components that you can use in your JSX.
25-
* [APIs](/reference/react/apis) - APIs that are useful for defining components.
26-
* [Directives](/reference/rsc/directives) - Provide instructions to bundlers compatible with React Server Components.
27-
>>>>>>> 0f2284ddc8dcab8bbb9b42c04f3c7af94b5b2e73
2821

2922
## React DOM {/*react-dom*/}
3023

src/content/reference/react/useLayoutEffect.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -67,7 +67,7 @@ function Tooltip() {
6767
6868
* `useLayoutEffect` 内のコードと、そこでスケジュールされたすべての state 更新は、**ブラウザによる画面の再描画をブロックします**。過度に使用すると、アプリが遅くなります。可能な限り [`useEffect` を使用してください](/reference/react/useEffect)。
6969
70-
* If you trigger a state update inside `useLayoutEffect`, React will execute all remaining Effects immediately including `useEffect`.
70+
* `useLayoutEffect` 内で state の更新をトリガすると、React は `useEffect` も含む残りのエフェクトをすべて即座に実行します。
7171
7272
---
7373

src/content/reference/react/useSyncExternalStore.md

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -41,11 +41,7 @@ function TodosApp() {
4141
4242
#### 引数 {/*parameters*/}
4343
44-
<<<<<<< HEAD
45-
* `subscribe`: ストアにサブスクライブを開始し、また callback 引数を受け取る関数。ストアが変更された際に渡された callback を呼び出す必要があります。これにより、コンポーネントが再レンダーされます。`subscribe` 関数は、サブスクリプションをクリーンアップする関数を返す必要があります。
46-
=======
47-
* `subscribe`: A function that takes a single `callback` argument and subscribes it to the store. When the store changes, it should invoke the provided `callback`, which will cause React to re-call `getSnapshot` and (if needed) re-render the component. The `subscribe` function should return a function that cleans up the subscription.
48-
>>>>>>> 0f2284ddc8dcab8bbb9b42c04f3c7af94b5b2e73
44+
* `subscribe`: ストアにサブスクライブを開始し、また callback 引数を受け取る関数。この関数はストアが変更された際に渡された callback を呼び出す必要があります。これにより React は `getSnapshot` を呼び出し、(必要に応じて)コンポーネントを再レンダーします。`subscribe` 関数は、サブスクリプションをクリーンアップする関数を返す必要があります。
4945
5046
* `getSnapshot`: コンポーネントが必要とするストアにあるデータのスナップショットを返す関数。ストアが変更されていない場合、`getSnapshot` への再呼び出しは同じ値を返す必要があります。ストアが変更されて返された値が([`Object.is`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is) で比較して)異なる場合、React はコンポーネントを再レンダーします。
5147

0 commit comments

Comments
 (0)