From 96f8b2647db87747497534d7fd26c9eef0acb7bd Mon Sep 17 00:00:00 2001 From: jasonqiu212 Date: Fri, 24 Jan 2025 01:15:10 +0800 Subject: [PATCH 1/2] docs(cn): improve translation --- src/content/learn/thinking-in-react.md | 2 +- src/content/learn/tutorial-tic-tac-toe.md | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/content/learn/thinking-in-react.md b/src/content/learn/thinking-in-react.md index 2f2699a813..fa7dfadc11 100644 --- a/src/content/learn/thinking-in-react.md +++ b/src/content/learn/thinking-in-react.md @@ -466,7 +466,7 @@ function SearchBar({ filterText, inStockOnly }) { ## 步骤五:添加反向数据流 {/*step-5-add-inverse-data-flow*/} -目前你的应用程序可以带着 props 和 state 随着层级结构进行正确渲染。但是根据用户的输入改变 state,需要通过其它的方式支持数据流:深层结构的表单组件需要在 `FilterableProductTable` 中更新 state。 +目前你的应用程序可以带着 props 和 state 随着层级结构进行渲染。但是如需用户的输入来改变 state,你需要让数据可以反向地传输:深层结构的表单组件需要更新 `FilterableProductTable` 的 state。 React 使数据流显式展示,是与双向数据绑定相比,需要更多的输入。如果你尝试在上述的例子中输入或者勾选复选框,发现 React 忽视了你的输入。这点是有意为之的。通过 ``,已经设置了 `input` 的 `value` 属性,使之恒等于从 `FilterableProductTable` 传递的 `filterText` state。只要 `filterText` state 不设置,(输入框的)输入就不会改变。 diff --git a/src/content/learn/tutorial-tic-tac-toe.md b/src/content/learn/tutorial-tic-tac-toe.md index c7c9de4eb4..642391edc6 100644 --- a/src/content/learn/tutorial-tic-tac-toe.md +++ b/src/content/learn/tutorial-tic-tac-toe.md @@ -1127,7 +1127,7 @@ export default function Board() { } ``` - `handleClick` 函数使用 JavaScript 数组的 `slice()` 方法创建 `squares` 数组(`nextSquares`)的副本。然后,`handleClick` 更新 `nextSquares` 数组,将 `X` 添加到第一个(`[0]` 索引)方块。 + `handleClick` 函数使用 JavaScript 数组的 `slice()` 方法创建 `squares` 数组的副本(`nextSquares`)。然后,`handleClick` 更新 `nextSquares` 数组,将 `X` 添加到第一个(`[0]` 索引)方块。 调用 `setSquares` 函数让 React 知道组件的 state 已经改变。这将触发使用 `squares` state 的组件(`Board`)及其子组件(构成棋盘的 `Square` 组件)的重新渲染。 From c0ff479729c6262726adb8e4d591e2a94d27ad50 Mon Sep 17 00:00:00 2001 From: Jason Qiu Date: Fri, 24 Jan 2025 09:37:07 +0800 Subject: [PATCH 2/2] docs(cn): improve translation after feedback Co-authored-by: Xleine --- src/content/learn/thinking-in-react.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/content/learn/thinking-in-react.md b/src/content/learn/thinking-in-react.md index fa7dfadc11..f94b77e4e3 100644 --- a/src/content/learn/thinking-in-react.md +++ b/src/content/learn/thinking-in-react.md @@ -466,7 +466,7 @@ function SearchBar({ filterText, inStockOnly }) { ## 步骤五:添加反向数据流 {/*step-5-add-inverse-data-flow*/} -目前你的应用程序可以带着 props 和 state 随着层级结构进行渲染。但是如需用户的输入来改变 state,你需要让数据可以反向地传输:深层结构的表单组件需要更新 `FilterableProductTable` 的 state。 +目前你的应用程序可以带着 props 和 state 随着层级结构进行渲染。但是为了支持通过用户输入来改变 state,你需要让数据反向传输:深层结构的表单组件需要更新 `FilterableProductTable` 的 state。 React 使数据流显式展示,是与双向数据绑定相比,需要更多的输入。如果你尝试在上述的例子中输入或者勾选复选框,发现 React 忽视了你的输入。这点是有意为之的。通过 ``,已经设置了 `input` 的 `value` 属性,使之恒等于从 `FilterableProductTable` 传递的 `filterText` state。只要 `filterText` state 不设置,(输入框的)输入就不会改变。