Skip to content

Commit dea3597

Browse files
committed
fix conflicts
1 parent b48adfc commit dea3597

File tree

2 files changed

+4
-18
lines changed

2 files changed

+4
-18
lines changed

src/content/learn/conditional-rendering.md

Lines changed: 2 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -54,11 +54,7 @@ export default function PackingList() {
5454

5555
</Sandpack>
5656

57-
<<<<<<< HEAD
58-
需要注意的是,有些 `Item` 组件的 `isPacked` 属性是被设为 `true` 而不是 `false`。你可以在那些满足 `isPacked={true}` 条件的物品旁加上一个勾选符号(✔)。
59-
=======
60-
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}`.
61-
>>>>>>> 7d50c3ffd4df2dc7903f4e41069653a456a9c223
57+
需要注意的是,有些 `Item` 组件的 `isPacked` 属性是被设为 `true` 而不是 `false`。你可以在那些满足 `isPacked={true}` 条件的物品旁加上一个勾选符号(✅)。
6258

6359
你可以用 [if/else 语句](https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Statements/if...else) 去判断:
6460

@@ -208,11 +204,7 @@ return (
208204
);
209205
```
210206

211-
<<<<<<< HEAD
212-
你可以认为,*“如果 `isPacked` 为 true 时,则(`?`)渲染 `name + ' ✔'`,否则(`:`)渲染 `name`。”*
213-
=======
214-
You can read it as *"if `isPacked` is true, then (`?`) render `name + ' ✅'`, otherwise (`:`) render `name`"*.
215-
>>>>>>> 7d50c3ffd4df2dc7903f4e41069653a456a9c223
207+
你可以认为,*“如果 `isPacked` 为 true 时,则(`?`)渲染 `name + ' ✅'`,否则(`:`)渲染 `name`。”*
216208

217209
<DeepDive>
218210

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

Lines changed: 2 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -408,15 +408,9 @@ function Game() {
408408
409409
这段代码里有两个问题。
410410
411-
<<<<<<< HEAD
412-
一个问题是它非常低效:在链式的每个 `set` 调用之间,组件(及其子组件)都不得不重新渲染。在上面的例子中,在最坏的情况下(`setCard` → 渲染 → `setGoldCardCount` → 渲染 → `setRound` → 渲染 → `setIsGameOver` → 渲染)有三次不必要的重新渲染。
411+
第一个问题是它非常低效:在链式的每个 `set` 调用之间,组件(及其子组件)都不得不重新渲染。在上面的例子中,在最坏的情况下(`setCard` → 渲染 → `setGoldCardCount` → 渲染 → `setRound` → 渲染 → `setIsGameOver` → 渲染)有三次不必要的重新渲染。
413412
414-
即使不考虑渲染效率问题,随着代码不断扩展,你会遇到这条 “链式” 调用不符合新需求的情况。试想一下,你现在需要添加一种方法来回溯游戏的历史记录,可以通过更新每个 state 变量到之前的值来实现。然而,将 `card` 设置为之前的的某个值会再次触发 Effect 链并更改你正在显示的数据。这样的代码往往是僵硬而脆弱的。
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-
>>>>>>> 7d50c3ffd4df2dc7903f4e41069653a456a9c223
413+
第二个问题是,即使不考虑渲染效率问题,随着代码不断扩展,你会遇到这条 “链式” 调用不符合新需求的情况。试想一下,你现在需要添加一种方法来回溯游戏的历史记录,可以通过更新每个 state 变量到之前的值来实现。然而,将 `card` 设置为之前的的某个值会再次触发 Effect 链并更改你正在显示的数据。这样的代码往往是僵硬而脆弱的。
420414
421415
在这个例子中,更好的做法是:尽可能在渲染期间进行计算,以及在事件处理函数中调整 state:
422416

0 commit comments

Comments
 (0)