-
Notifications
You must be signed in to change notification settings - Fork 1.1k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
docs(cn): translate content/docs/components-and-props.md into Chinese #79
docs(cn): translate content/docs/components-and-props.md into Chinese #79
Conversation
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
有些地方语意不对
Deploy preview for cn-reactjs ready! Built with commit 3a9c7c8 |
content/docs/components-and-props.md
Outdated
|
||
```js | ||
function Welcome(props) { | ||
return <h1>Hello, {props.name}</h1>; | ||
} | ||
``` | ||
|
||
This function is a valid React component because it accepts a single "props" (which stands for properties) object argument with data and returns a React element. We call such components "function components" because they are literally JavaScript functions. | ||
该函数是一个有效的 React 组件,因为它接受唯一带有数据的 “props”(代表属性)对象与并返回一个 React 元素。这类组件被称为“函数组件”,因为它本质上就是 JavaScript 函数。 |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
-
函数参数是统一用接收还是接受?我觉得接收好一些。
-
代表属性 => 是 properties 缩写,代表属性。
properties 翻译出来比较好 -
这类组件被称为“函数组件”
本段小标题是"函数式组件",我觉得用函数组件比较好,和 Vue 的 functional component 区分。
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
我觉得没必要区分,函数式组件就是 React 先提出来的
content/docs/components-and-props.md
Outdated
|
||
## Rendering a Component {#rendering-a-component} | ||
## 组件渲染 {#rendering-a-component} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
组件渲染 => 渲染一个组件
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
我觉得渲染一个组件太啰嗦了,渲染组件吧
@@ -198,7 +198,7 @@ function Comment(props) { | |||
} | |||
``` | |||
|
|||
Next, we will extract a `UserInfo` component that renders an `Avatar` next to the user's name: | |||
接下来,我们将提取 `UserInfo` 组件,该组件在用户名旁渲染 `Avatar` 组件: |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
用户名旁 => 用户名称旁边
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
感觉有点长
content/docs/components-and-props.md
Outdated
|
||
Of course, application UIs are dynamic and change over time. In the [next section](/docs/state-and-lifecycle.html), we will introduce a new concept of "state". State allows React components to change their output over time in response to user actions, network responses, and anything else, without violating this rule. | ||
当然,应用程序的 UI 是动态的,并会伴随着时间的推移而变化。在[下一章节](/docs/state-and-lifecycle.html)中,我们将介绍一种新的概念,称之为 “state”。State 可以在不违反上述规则的情况下,允许 React 组件随用户操作、网络响应或者其他变化而动态更改输出内容。。 |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
State 小写
这句多了个句号
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
State 在作为句首时不应该大写嘛?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
中文不需要大写
content/docs/components-and-props.md
Outdated
|
||
## Function and Class Components {#function-and-class-components} | ||
## 函数式组件与 class 组件 {#function-and-class-components} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
这里感觉有点画蛇添足,没必要翻译成函数式组件,因为是在强调函数定义和类定义两种。
如果前后文有 side effect,也用了 functional,那种情况要翻译成函数式,强调的是函数式编程。
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
区分函数组件与 class 组件
content/docs/components-and-props.md
Outdated
|
||
```js | ||
function Welcome(props) { | ||
return <h1>Hello, {props.name}</h1>; | ||
} | ||
``` | ||
|
||
This function is a valid React component because it accepts a single "props" (which stands for properties) object argument with data and returns a React element. We call such components "function components" because they are literally JavaScript functions. | ||
该函数是一个有效的 React 组件,因为它接收唯一带有数据的 “props”(代表属性)对象与并返回一个 React 元素。这类组件被称为“函数式组件”,因为它本质上就是 JavaScript 函数。 |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
这里的函数式,同上
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
single 应该不是强调唯一,这里的 single 意思是函数接收单个参数,翻译成“一个”就行
content/docs/components-and-props.md
Outdated
|
||
Classes have some additional features that we will discuss in the [next sections](/docs/state-and-lifecycle.html). Until then, we will use function components for their conciseness. | ||
我们将在[下一章节](/docs/state-and-lifecycle.html)中讨论关于 class 的额外特性。在那之前,为了保持示例简单明了,将使用函数式组件。 |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
这里的函数式,同上
> | ||
>To learn more about the reasoning behind this convention, please read [JSX In Depth](/docs/jsx-in-depth.html#user-defined-components-must-be-capitalized). |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
JSX In Depth => 深入 JSX
content/docs/components-and-props.md
Outdated
|
||
Of course, application UIs are dynamic and change over time. In the [next section](/docs/state-and-lifecycle.html), we will introduce a new concept of "state". State allows React components to change their output over time in response to user actions, network responses, and anything else, without violating this rule. | ||
当然,应用程序的 UI 是动态的,并会伴随着时间的推移而变化。在[下一章节](/docs/state-and-lifecycle.html)中,我们将介绍一种新的概念,称之为 “state”。State 可以在不违反上述规则的情况下,允许 React 组件随用户操作、网络响应或者其他变化而动态更改输出内容。。 |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
中文不需要大写
Deploy preview for zh-hans-reactjs ready! Built with commit 3a9c7c8 |
Review this PR!