From a2a6a673eccdf64d4a9870aa8263360fbf493974 Mon Sep 17 00:00:00 2001
From: Ryanhui <ryanhui1996@gmail.com>
Date: Wed, 13 Feb 2019 15:42:43 +0800
Subject: [PATCH 1/7] docs(cn): translate content/docs/reference-react-dom.md
 into Chinese

---
 content/docs/reference-react-dom.md | 71 ++++++++++++++---------------
 1 file changed, 33 insertions(+), 38 deletions(-)

diff --git a/content/docs/reference-react-dom.md b/content/docs/reference-react-dom.md
index 3732ebe8d7..36fc1bbdde 100644
--- a/content/docs/reference-react-dom.md
+++ b/content/docs/reference-react-dom.md
@@ -6,11 +6,11 @@ category: Reference
 permalink: docs/react-dom.html
 ---
 
-If you load React from a `<script>` tag, these top-level APIs are available on the `ReactDOM` global. If you use ES6 with npm, you can write `import ReactDOM from 'react-dom'`. If you use ES5 with npm, you can write `var ReactDOM = require('react-dom')`.
+如果您使用一个 `<script>` 标签引入React，所有的顶层API都能在 `ReactDOM` 的全局范围内被调用。如果您使用npm和ES6, 您可以用 `import ReactDOM from 'react-dom'`。如果您使用npm和ES5, 您可以用 `var ReactDOM = require('react-dom')`。
 
-## Overview {#overview}
+## 概述 {#overview}
 
-The `react-dom` package provides DOM-specific methods that can be used at the top level of your app and as an escape hatch to get outside of the React model if you need to. Most of your components should not need to use this module.
+`react-dom` 包提供了可在应用顶层使用的 DOM 特定（DOM-specific）的方法，如果有需要，您可以把这些方法用作到React模型外面的逃生出口。不过一般情况下，您的大部分组件都不需要使用这个包。
 
 - [`render()`](#render)
 - [`hydrate()`](#hydrate)
@@ -18,41 +18,38 @@ The `react-dom` package provides DOM-specific methods that can be used at the to
 - [`findDOMNode()`](#finddomnode)
 - [`createPortal()`](#createportal)
 
-### Browser Support {#browser-support}
+### 浏览器支持 {#browser-support}
 
-React supports all popular browsers, including Internet Explorer 9 and above, although [some polyfills are required](/docs/javascript-environment-requirements.html) for older browsers such as IE 9 and IE 10.
+React 支持所有的现代浏览器，包括 IE9 及以上版本，但是需要为老浏览器比如 IE9 和 IE10 引入[一些polyfills](/docs/javascript-environment-requirements.html)。
 
-> Note
+> 注意：
 >
-> We don't support older browsers that don't support ES5 methods, but you may find that your apps do work in older browsers if polyfills such as [es5-shim and es5-sham](https://github.com/es-shims/es5-shim) are included in the page. You're on your own if you choose to take this path.
+>我们不支持那些不兼容 ES5 方法的老浏览器，但如果您的应用包含了 polyfill，例如 [es5-shim and es5-sham](https://github.com/es-shims/es5-shim) 您可能会发现您的应用仍然可以在这些浏览器中正常运行。不过如果您选择这种方法，您便需要孤军奋战了。
 
 * * *
 
-## Reference {#reference}
+## 参考 {#reference}
 
 ### `render()` {#render}
 
 ```javascript
 ReactDOM.render(element, container[, callback])
 ```
+在提供的 `container` 里渲染一个 React 元素，返回一个这个组件的[引用](/docs/more-about-refs.html)（或者为[无状态组件](/docs/components-and-props.html#functional-and-class-components)返回 `null`）。
 
-Render a React element into the DOM in the supplied `container` and return a [reference](/docs/more-about-refs.html) to the component (or returns `null` for [stateless components](/docs/components-and-props.html#functional-and-class-components)).
+如果 React 元素之前已经在 `container` 里渲染过，这将会进行一次更新，并且只会在必要时改变 DOM 来体现最新的 React 元素。
 
-If the React element was previously rendered into `container`, this will perform an update on it and only mutate the DOM as necessary to reflect the latest React element.
+如果提供了可选的回调函数，回调将在组件被渲染或更新之后执行。
 
-If the optional callback is provided, it will be executed after the component is rendered or updated.
-
-> Note:
+> 注意:
 >
-> `ReactDOM.render()` controls the contents of the container node you pass in. Any existing DOM elements inside are replaced when first called. Later calls use React’s DOM diffing algorithm for efficient updates.
+> `ReactDOM.render()` 会控制你提供的容器节点里的内容。当第一次调用时，容器节点里的所有 DOM 元素都会被清除，后续的调用则会使用 React 的 DOM 差分算法（DOM diffing algorithm）进行高效的更新。
 >
-> `ReactDOM.render()` does not modify the container node (only modifies the children of the container). It may be possible to insert a component to an existing DOM node without overwriting the existing children.
+> `ReactDOM.render()` 不会修改容器节点（只会修改容器的子节点）。你可以在不覆盖已有子节点的情况下添加一个组件到已有的 DOM 节点中去。
 >
-> `ReactDOM.render()` currently returns a reference to the root `ReactComponent` instance. However, using this return value is legacy
-> and should be avoided because future versions of React may render components asynchronously in some cases. If you need a reference to the root `ReactComponent` instance, the preferred solution is to attach a
-> [callback ref](/docs/more-about-refs.html#the-ref-callback-attribute) to the root element.
+> `ReactDOM.render()` 目前会返回一个指向根 `ReactComponent` 实例的引用。但是使用返回值的这种写法来自历史遗留并且应该避免，因为在未来版本的 React 中，组件的渲染在某些情况下会是异步的。如果您真的需要一个指向根 `ReactComponent` 实例的引用，推荐的方法是添加一个 [callback ref](/docs/more-about-refs.html#the-ref-callback-attribute) 到根元素上。
 >
-> Using `ReactDOM.render()` to hydrate a server-rendered container is deprecated and will be removed in React 17. Use [`hydrate()`](#hydrate) instead.
+> 使用 `ReactDOM.render()` 混合服务端渲染的容器已经弃用了，并且会在 React 17 被移除。作为替代，使用 [`hydrate()`](#hydrate)。
 
 * * *
 
@@ -60,17 +57,17 @@ If the optional callback is provided, it will be executed after the component is
 
 ```javascript
 ReactDOM.hydrate(element, container[, callback])
-```
 
-Same as [`render()`](#render), but is used to hydrate a container whose HTML contents were rendered by [`ReactDOMServer`](/docs/react-dom-server.html). React will attempt to attach event listeners to the existing markup.
+```
+和 [`render()`](#render) 相同，用来混合由 [`ReactDOMServer`](/docs/react-dom-server.html) 渲染 HTML 内容的容器。React 会尝试在已有标记上绑定事件监听器。
 
-React expects that the rendered content is identical between the server and the client. It can patch up differences in text content, but you should treat mismatches as bugs and fix them. In development mode, React warns about mismatches during hydration. There are no guarantees that attribute differences will be patched up in case of mismatches. This is important for performance reasons because in most apps, mismatches are rare, and so validating all markup would be prohibitively expensive.
+React 期望服务端和客户端渲染的内容完全一致。React 可以弥补文本内容的差异，但是您需要将不匹配的地方作为 bug 进行修复。在开发者模式，React 会对混合过程中的不匹配进行警告。不过不能保证在不匹配的情况下，属性的不同会被修补。在性能原因上这很重要，因为大多是应用很少有不匹配的情况，所以验证所有的标记将会造成过于昂贵的性能开销。
 
-If a single element's attribute or text content is unavoidably different between the server and the client (for example, a timestamp), you may silence the warning by adding `suppressHydrationWarning={true}` to the element. It only works one level deep, and is intended to be an escape hatch. Don't overuse it. Unless it's text content, React still won't attempt to patch it up, so it may remain inconsistent until future updates.
+如果一个单一元素的属性或者文本内容，在服务端和客户端之间不可避免的不同（比如：时间戳），您可以为元素添加 `suppressHydrationWarning={true}` 隐藏警告。这种方式只在一层深度上有效，而且应只作为一个逃生窗口（escape hatch）。除非是文本内容，否则不要滥用，React 不会尝试修补不同，所以在未来的更新以前，仍会保持不一致。
 
-If you intentionally need to render something different on the server and the client, you can do a two-pass rendering. Components that render something different on the client can read a state variable like `this.state.isClient`, which you can set to `true` in `componentDidMount()`. This way the initial render pass will render the same content as the server, avoiding mismatches, but an additional pass will happen synchronously right after hydration. Note that this approach will make your components slower because they have to render twice, so use it with caution.
+如果您刻意的在服务端与客户端渲染不同内容，您可以采用两遍（two-pass）渲染。在客户端渲染不同内容的组件可以读取一个 state 变量，例如 `this.state.isClient`，您可以在 `componentDidMount()` 里将它设置为 `true`。这种方式在初始渲染时会和服务端渲染相同的内容，避免不同。混合之后，另外的操作会同步进行。 注意，因为进行了两次渲染，这种实现会使您的组件变慢，请小心使用。
 
-Remember to be mindful of user experience on slow connections. The JavaScript code may load significantly later than the initial HTML render, so if you render something different in the client-only pass, the transition can be jarring. However, if executed well, it may be beneficial to render a "shell" of the application on the server, and only show some of the extra widgets on the client. To learn how to do this without getting the markup mismatch issues, refer to the explanation in the previous paragraph.
+记得留意弱网络环境下的用户体验，JavaScript 代码的加载可能比初始 HTML 渲染晚的多。所以如果您只在客户端渲染不同的内容，其变化可能会有冲突。但是，如果执行顺利，在服务端渲染外壳（shell）也许是有益的，并且只需在客户端显示额外的小组件。要了解如何在避免不匹配标记问题下实现，请参考上一段的解释。
 
 * * *
 
@@ -79,29 +76,28 @@ Remember to be mindful of user experience on slow connections. The JavaScript co
 ```javascript
 ReactDOM.unmountComponentAtNode(container)
 ```
-
-Remove a mounted React component from the DOM and clean up its event handlers and state. If no component was mounted in the container, calling this function does nothing. Returns `true` if a component was unmounted and `false` if there was no component to unmount.
+从 DOM 中移除一个已经挂载的组件，并且清除其事件处理器（event handlers）和 state 。如果指定容器上没有已挂载组件，这个函数什么也不会做。如果组件被移除将会返回 `true`，如果没有组件可被移除将会返回 `false`。
 
 * * *
 
 ### `findDOMNode()` {#finddomnode}
 
-> Note:
->
-> `findDOMNode` is an escape hatch used to access the underlying DOM node. In most cases, use of this escape hatch is discouraged because it pierces the component abstraction. [It has been deprecated in `StrictMode`.](/docs/strict-mode.html#warning-about-deprecated-finddomnode-usage)
+> 注意:
+> `findDOMNode` 是一个访问底层 DOM 节点的逃生窗口（escape hatch）。在大多数情况下，不鼓励使用这个方法，因为它会穿透组件的抽象结构。[严格模式下这个方法已经弃用。](/docs/strict-mode.html#warning-about-deprecated-finddomnode-usage)
+
 
 ```javascript
 ReactDOM.findDOMNode(component)
 ```
-If this component has been mounted into the DOM, this returns the corresponding native browser DOM element. This method is useful for reading values out of the DOM, such as form field values and performing DOM measurements. **In most cases, you can attach a ref to the DOM node and avoid using `findDOMNode` at all.**
+如果组件已经被挂载到 DOM 上，这个方法会返回相应的原生浏览器 DOM 元素。这个方法对于从 DOM 中读取值很有用，例如表单字段的值和执行 DOM 测量（performing DOM measurements）。**大多数情况下，您可以绑定一个 ref 到 DOM 节点上，完全避免使用 findDOMNode。**
 
-When a component renders to `null` or `false`, `findDOMNode` returns `null`. When a component renders to a string, `findDOMNode` returns a text DOM node containing that value. As of React 16, a component may return a fragment with multiple children, in which case `findDOMNode` will return the DOM node corresponding to the first non-empty child.
+当一个组件渲染的内容是 `null` 或者 `false` 时，`findDOMNode` 返回的是 `null`。当一个组件渲染的是字符串时，`findDOMNode` 返回的包含这个值的文本 DOM 节点。从 React 16 开始，一个组件可能会返回有多个子节点的碎片（fragment），在这个情况下，`findDOMNode` 会返回第一个非空子节点对应的 DOM 节点。
 
-> Note:
+> 注意:
 >
-> `findDOMNode` only works on mounted components (that is, components that have been placed in the DOM). If you try to call this on a component that has not been mounted yet (like calling `findDOMNode()` in `render()` on a component that has yet to be created) an exception will be thrown.
->
-> `findDOMNode` cannot be used on function components.
+> `findDOMNode` 只在挂载的组件上可用（即，已经放置在 DOM 中的组件）。如果您尝试调用一个未挂载的组件（例如在一个还未创建的组件上调用 `render()` 中的 `findDOMNode()`）将会引发异常。
+> 
+> `findDOMNode` 不能用于函数式组件。
 
 * * *
 
@@ -110,5 +106,4 @@ When a component renders to `null` or `false`, `findDOMNode` returns `null`. Whe
 ```javascript
 ReactDOM.createPortal(child, container)
 ```
-
-Creates a portal. Portals provide a way to [render children into a DOM node that exists outside the hierarchy of the DOM component](/docs/portals.html).
+创建一个入口。入口提供了一种[将子节点渲染到 DOM 节点中的方法，该节点存在于 DOM 组件的层次结构之外](/docs/portals.html)。

From d8d1a30ba57da2c75a764d19dc1ac6524eb76e6d Mon Sep 17 00:00:00 2001
From: Ryanhui <ryanhui1996@gmail.com>
Date: Wed, 13 Feb 2019 15:51:59 +0800
Subject: [PATCH 2/7] =?UTF-8?q?change=20=E6=82=A8=20to=20=E4=BD=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 content/docs/reference-react-dom.md | 20 ++++++++++----------
 1 file changed, 10 insertions(+), 10 deletions(-)

diff --git a/content/docs/reference-react-dom.md b/content/docs/reference-react-dom.md
index 36fc1bbdde..69f82c42e2 100644
--- a/content/docs/reference-react-dom.md
+++ b/content/docs/reference-react-dom.md
@@ -6,11 +6,11 @@ category: Reference
 permalink: docs/react-dom.html
 ---
 
-如果您使用一个 `<script>` 标签引入React，所有的顶层API都能在 `ReactDOM` 的全局范围内被调用。如果您使用npm和ES6, 您可以用 `import ReactDOM from 'react-dom'`。如果您使用npm和ES5, 您可以用 `var ReactDOM = require('react-dom')`。
+如果你使用一个 `<script>` 标签引入React，所有的顶层API都能在 `ReactDOM` 的全局范围内被调用。如果你使用npm和ES6, 你可以用 `import ReactDOM from 'react-dom'`。如果你使用npm和ES5, 你可以用 `var ReactDOM = require('react-dom')`。
 
 ## 概述 {#overview}
 
-`react-dom` 包提供了可在应用顶层使用的 DOM 特定（DOM-specific）的方法，如果有需要，您可以把这些方法用作到React模型外面的逃生出口。不过一般情况下，您的大部分组件都不需要使用这个包。
+`react-dom` 包提供了可在应用顶层使用的 DOM 特定（DOM-specific）的方法，如果有需要，你可以把这些方法用作到React模型外面的逃生出口。不过一般情况下，你的大部分组件都不需要使用这个包。
 
 - [`render()`](#render)
 - [`hydrate()`](#hydrate)
@@ -24,7 +24,7 @@ React 支持所有的现代浏览器，包括 IE9 及以上版本，但是需要
 
 > 注意：
 >
->我们不支持那些不兼容 ES5 方法的老浏览器，但如果您的应用包含了 polyfill，例如 [es5-shim and es5-sham](https://github.com/es-shims/es5-shim) 您可能会发现您的应用仍然可以在这些浏览器中正常运行。不过如果您选择这种方法，您便需要孤军奋战了。
+>我们不支持那些不兼容 ES5 方法的老浏览器，但如果你的应用包含了 polyfill，例如 [es5-shim and es5-sham](https://github.com/es-shims/es5-shim) 你可能会发现你的应用仍然可以在这些浏览器中正常运行。不过如果你选择这种方法，你便需要孤军奋战了。
 
 * * *
 
@@ -47,7 +47,7 @@ ReactDOM.render(element, container[, callback])
 >
 > `ReactDOM.render()` 不会修改容器节点（只会修改容器的子节点）。你可以在不覆盖已有子节点的情况下添加一个组件到已有的 DOM 节点中去。
 >
-> `ReactDOM.render()` 目前会返回一个指向根 `ReactComponent` 实例的引用。但是使用返回值的这种写法来自历史遗留并且应该避免，因为在未来版本的 React 中，组件的渲染在某些情况下会是异步的。如果您真的需要一个指向根 `ReactComponent` 实例的引用，推荐的方法是添加一个 [callback ref](/docs/more-about-refs.html#the-ref-callback-attribute) 到根元素上。
+> `ReactDOM.render()` 目前会返回一个指向根 `ReactComponent` 实例的引用。但是使用返回值的这种写法来自历史遗留并且应该避免，因为在未来版本的 React 中，组件的渲染在某些情况下会是异步的。如果你真的需要一个指向根 `ReactComponent` 实例的引用，推荐的方法是添加一个 [callback ref](/docs/more-about-refs.html#the-ref-callback-attribute) 到根元素上。
 >
 > 使用 `ReactDOM.render()` 混合服务端渲染的容器已经弃用了，并且会在 React 17 被移除。作为替代，使用 [`hydrate()`](#hydrate)。
 
@@ -61,13 +61,13 @@ ReactDOM.hydrate(element, container[, callback])
 ```
 和 [`render()`](#render) 相同，用来混合由 [`ReactDOMServer`](/docs/react-dom-server.html) 渲染 HTML 内容的容器。React 会尝试在已有标记上绑定事件监听器。
 
-React 期望服务端和客户端渲染的内容完全一致。React 可以弥补文本内容的差异，但是您需要将不匹配的地方作为 bug 进行修复。在开发者模式，React 会对混合过程中的不匹配进行警告。不过不能保证在不匹配的情况下，属性的不同会被修补。在性能原因上这很重要，因为大多是应用很少有不匹配的情况，所以验证所有的标记将会造成过于昂贵的性能开销。
+React 期望服务端和客户端渲染的内容完全一致。React 可以弥补文本内容的差异，但是你需要将不匹配的地方作为 bug 进行修复。在开发者模式，React 会对混合过程中的不匹配进行警告。不过不能保证在不匹配的情况下，属性的不同会被修补。在性能原因上这很重要，因为大多是应用很少有不匹配的情况，所以验证所有的标记将会造成过于昂贵的性能开销。
 
-如果一个单一元素的属性或者文本内容，在服务端和客户端之间不可避免的不同（比如：时间戳），您可以为元素添加 `suppressHydrationWarning={true}` 隐藏警告。这种方式只在一层深度上有效，而且应只作为一个逃生窗口（escape hatch）。除非是文本内容，否则不要滥用，React 不会尝试修补不同，所以在未来的更新以前，仍会保持不一致。
+如果一个单一元素的属性或者文本内容，在服务端和客户端之间不可避免的不同（比如：时间戳），你可以为元素添加 `suppressHydrationWarning={true}` 隐藏警告。这种方式只在一层深度上有效，而且应只作为一个逃生窗口（escape hatch）。除非是文本内容，否则不要滥用，React 不会尝试修补不同，所以在未来的更新以前，仍会保持不一致。
 
-如果您刻意的在服务端与客户端渲染不同内容，您可以采用两遍（two-pass）渲染。在客户端渲染不同内容的组件可以读取一个 state 变量，例如 `this.state.isClient`，您可以在 `componentDidMount()` 里将它设置为 `true`。这种方式在初始渲染时会和服务端渲染相同的内容，避免不同。混合之后，另外的操作会同步进行。 注意，因为进行了两次渲染，这种实现会使您的组件变慢，请小心使用。
+如果你刻意的在服务端与客户端渲染不同内容，你可以采用两遍（two-pass）渲染。在客户端渲染不同内容的组件可以读取一个 state 变量，例如 `this.state.isClient`，你可以在 `componentDidMount()` 里将它设置为 `true`。这种方式在初始渲染时会和服务端渲染相同的内容，避免不同。混合之后，另外的操作会同步进行。 注意，因为进行了两次渲染，这种实现会使你的组件变慢，请小心使用。
 
-记得留意弱网络环境下的用户体验，JavaScript 代码的加载可能比初始 HTML 渲染晚的多。所以如果您只在客户端渲染不同的内容，其变化可能会有冲突。但是，如果执行顺利，在服务端渲染外壳（shell）也许是有益的，并且只需在客户端显示额外的小组件。要了解如何在避免不匹配标记问题下实现，请参考上一段的解释。
+记得留意弱网络环境下的用户体验，JavaScript 代码的加载可能比初始 HTML 渲染晚的多。所以如果你只在客户端渲染不同的内容，其变化可能会有冲突。但是，如果执行顺利，在服务端渲染外壳（shell）也许是有益的，并且只需在客户端显示额外的小组件。要了解如何在避免不匹配标记问题下实现，请参考上一段的解释。
 
 * * *
 
@@ -89,13 +89,13 @@ ReactDOM.unmountComponentAtNode(container)
 ```javascript
 ReactDOM.findDOMNode(component)
 ```
-如果组件已经被挂载到 DOM 上，这个方法会返回相应的原生浏览器 DOM 元素。这个方法对于从 DOM 中读取值很有用，例如表单字段的值和执行 DOM 测量（performing DOM measurements）。**大多数情况下，您可以绑定一个 ref 到 DOM 节点上，完全避免使用 findDOMNode。**
+如果组件已经被挂载到 DOM 上，这个方法会返回相应的原生浏览器 DOM 元素。这个方法对于从 DOM 中读取值很有用，例如表单字段的值和执行 DOM 测量（performing DOM measurements）。**大多数情况下，你可以绑定一个 ref 到 DOM 节点上，完全避免使用 findDOMNode。**
 
 当一个组件渲染的内容是 `null` 或者 `false` 时，`findDOMNode` 返回的是 `null`。当一个组件渲染的是字符串时，`findDOMNode` 返回的包含这个值的文本 DOM 节点。从 React 16 开始，一个组件可能会返回有多个子节点的碎片（fragment），在这个情况下，`findDOMNode` 会返回第一个非空子节点对应的 DOM 节点。
 
 > 注意:
 >
-> `findDOMNode` 只在挂载的组件上可用（即，已经放置在 DOM 中的组件）。如果您尝试调用一个未挂载的组件（例如在一个还未创建的组件上调用 `render()` 中的 `findDOMNode()`）将会引发异常。
+> `findDOMNode` 只在挂载的组件上可用（即，已经放置在 DOM 中的组件）。如果你尝试调用一个未挂载的组件（例如在一个还未创建的组件上调用 `render()` 中的 `findDOMNode()`）将会引发异常。
 > 
 > `findDOMNode` 不能用于函数式组件。
 

From d8ab5c40b0b6a05c9dcbddd62fca862243d2cf1e Mon Sep 17 00:00:00 2001
From: Ryanhui <ryanhui1996@gmail.com>
Date: Thu, 28 Feb 2019 17:19:13 +0800
Subject: [PATCH 3/7] modify

---
 content/docs/reference-react-dom.md | 21 +++++++++++----------
 1 file changed, 11 insertions(+), 10 deletions(-)

diff --git a/content/docs/reference-react-dom.md b/content/docs/reference-react-dom.md
index 69f82c42e2..523fc0f08f 100644
--- a/content/docs/reference-react-dom.md
+++ b/content/docs/reference-react-dom.md
@@ -6,11 +6,11 @@ category: Reference
 permalink: docs/react-dom.html
 ---
 
-如果你使用一个 `<script>` 标签引入React，所有的顶层API都能在 `ReactDOM` 的全局范围内被调用。如果你使用npm和ES6, 你可以用 `import ReactDOM from 'react-dom'`。如果你使用npm和ES5, 你可以用 `var ReactDOM = require('react-dom')`。
+如果你使用一个 `<script>` 标签引入 React ，所有的顶层 API 都能在全局 `ReactDOM` 上调用。如果你使用 npm 和 ES6 ，你可以用 `import ReactDOM from 'react-dom'` 。如果你使用 npm 和 ES5 ，你可以用 `var ReactDOM = require('react-dom')` 。
 
 ## 概述 {#overview}
 
-`react-dom` 包提供了可在应用顶层使用的 DOM 特定（DOM-specific）的方法，如果有需要，你可以把这些方法用作到React模型外面的逃生出口。不过一般情况下，你的大部分组件都不需要使用这个包。
+`react-dom` 包提供了可在应用顶层使用的针对 DOM（DOM-specific）的方法，如果有需要，你可以把这些方法用作到 React 模型外面的逃生出口。不过一般情况下，你的大部分组件都不需要使用这个模块。
 
 - [`render()`](#render)
 - [`hydrate()`](#hydrate)
@@ -20,11 +20,11 @@ permalink: docs/react-dom.html
 
 ### 浏览器支持 {#browser-support}
 
-React 支持所有的现代浏览器，包括 IE9 及以上版本，但是需要为老浏览器比如 IE9 和 IE10 引入[一些polyfills](/docs/javascript-environment-requirements.html)。
+React 支持所有的现代浏览器，包括 IE9 及以上版本，但是需要为老浏览器比如 IE9 和 IE10 引入[一些 polyfills](/docs/javascript-environment-requirements.html) 。
 
 > 注意：
 >
->我们不支持那些不兼容 ES5 方法的老浏览器，但如果你的应用包含了 polyfill，例如 [es5-shim and es5-sham](https://github.com/es-shims/es5-shim) 你可能会发现你的应用仍然可以在这些浏览器中正常运行。不过如果你选择这种方法，你便需要孤军奋战了。
+>我们不支持那些不兼容 ES5 方法的老浏览器，但如果你的应用包含了 polyfill ，例如 [es5-shim and es5-sham](https://github.com/es-shims/es5-shim) 你可能会发现你的应用仍然可以在这些浏览器中正常运行。不过如果你选择这种方法，你便需要孤军奋战了。
 
 * * *
 
@@ -35,21 +35,22 @@ React 支持所有的现代浏览器，包括 IE9 及以上版本，但是需要
 ```javascript
 ReactDOM.render(element, container[, callback])
 ```
+
 在提供的 `container` 里渲染一个 React 元素，返回一个这个组件的[引用](/docs/more-about-refs.html)（或者为[无状态组件](/docs/components-and-props.html#functional-and-class-components)返回 `null`）。
 
 如果 React 元素之前已经在 `container` 里渲染过，这将会进行一次更新，并且只会在必要时改变 DOM 来体现最新的 React 元素。
 
 如果提供了可选的回调函数，回调将在组件被渲染或更新之后执行。
 
-> 注意:
+> 注意：
 >
-> `ReactDOM.render()` 会控制你提供的容器节点里的内容。当第一次调用时，容器节点里的所有 DOM 元素都会被清除，后续的调用则会使用 React 的 DOM 差分算法（DOM diffing algorithm）进行高效的更新。
+> `ReactDOM.render()` 会控制你提供的容器节点里的内容。当第一次调用时，容器节点里的所有 DOM 元素都会被替换，后续的调用则会使用 React 的 DOM 差分算法（DOM diffing algorithm）进行高效的更新。
 >
 > `ReactDOM.render()` 不会修改容器节点（只会修改容器的子节点）。你可以在不覆盖已有子节点的情况下添加一个组件到已有的 DOM 节点中去。
 >
 > `ReactDOM.render()` 目前会返回一个指向根 `ReactComponent` 实例的引用。但是使用返回值的这种写法来自历史遗留并且应该避免，因为在未来版本的 React 中，组件的渲染在某些情况下会是异步的。如果你真的需要一个指向根 `ReactComponent` 实例的引用，推荐的方法是添加一个 [callback ref](/docs/more-about-refs.html#the-ref-callback-attribute) 到根元素上。
 >
-> 使用 `ReactDOM.render()` 混合服务端渲染的容器已经弃用了，并且会在 React 17 被移除。作为替代，使用 [`hydrate()`](#hydrate)。
+> 使用 `ReactDOM.render()` 混合服务端渲染的容器已经废弃了，并且会在 React 17 被移除。作为替代，使用 [`hydrate()`](#hydrate)。
 
 * * *
 
@@ -65,7 +66,7 @@ React 期望服务端和客户端渲染的内容完全一致。React 可以弥
 
 如果一个单一元素的属性或者文本内容，在服务端和客户端之间不可避免的不同（比如：时间戳），你可以为元素添加 `suppressHydrationWarning={true}` 隐藏警告。这种方式只在一层深度上有效，而且应只作为一个逃生窗口（escape hatch）。除非是文本内容，否则不要滥用，React 不会尝试修补不同，所以在未来的更新以前，仍会保持不一致。
 
-如果你刻意的在服务端与客户端渲染不同内容，你可以采用两遍（two-pass）渲染。在客户端渲染不同内容的组件可以读取一个 state 变量，例如 `this.state.isClient`，你可以在 `componentDidMount()` 里将它设置为 `true`。这种方式在初始渲染时会和服务端渲染相同的内容，避免不同。混合之后，另外的操作会同步进行。 注意，因为进行了两次渲染，这种实现会使你的组件变慢，请小心使用。
+如果你刻意的在服务端与客户端渲染不同内容，你可以采用两遍（two-pass）渲染。在客户端渲染不同内容的组件可以读取一个 state 变量，例如 `this.state.isClient` ，你可以在 `componentDidMount()` 里将它设置为 `true` 。这种方式在初始渲染时会和服务端渲染相同的内容，避免不同。混合之后，另外的操作会同步进行。 注意，因为进行了两次渲染，这种实现会使你的组件变慢，请小心使用。
 
 记得留意弱网络环境下的用户体验，JavaScript 代码的加载可能比初始 HTML 渲染晚的多。所以如果你只在客户端渲染不同的内容，其变化可能会有冲突。但是，如果执行顺利，在服务端渲染外壳（shell）也许是有益的，并且只需在客户端显示额外的小组件。要了解如何在避免不匹配标记问题下实现，请参考上一段的解释。
 
@@ -76,7 +77,7 @@ React 期望服务端和客户端渲染的内容完全一致。React 可以弥
 ```javascript
 ReactDOM.unmountComponentAtNode(container)
 ```
-从 DOM 中移除一个已经挂载的组件，并且清除其事件处理器（event handlers）和 state 。如果指定容器上没有已挂载组件，这个函数什么也不会做。如果组件被移除将会返回 `true`，如果没有组件可被移除将会返回 `false`。
+从 DOM 中移除一个已经挂载的组件，并且清除其事件处理器（event handlers）和 state 。如果指定容器上没有已挂载组件，这个函数什么也不会做。如果组件被移除将会返回 `true` ，如果没有组件可被移除将会返回 `false` 。
 
 * * *
 
@@ -91,7 +92,7 @@ ReactDOM.findDOMNode(component)
 ```
 如果组件已经被挂载到 DOM 上，这个方法会返回相应的原生浏览器 DOM 元素。这个方法对于从 DOM 中读取值很有用，例如表单字段的值和执行 DOM 测量（performing DOM measurements）。**大多数情况下，你可以绑定一个 ref 到 DOM 节点上，完全避免使用 findDOMNode。**
 
-当一个组件渲染的内容是 `null` 或者 `false` 时，`findDOMNode` 返回的是 `null`。当一个组件渲染的是字符串时，`findDOMNode` 返回的包含这个值的文本 DOM 节点。从 React 16 开始，一个组件可能会返回有多个子节点的碎片（fragment），在这个情况下，`findDOMNode` 会返回第一个非空子节点对应的 DOM 节点。
+当一个组件渲染的内容是 `null` 或者 `false` 时， `findDOMNode` 返回的是 `null` 。当一个组件渲染的是字符串时，`findDOMNode` 返回的包含这个值的文本 DOM 节点。从 React 16 开始，一个组件可能会返回有多个子节点的碎片（fragment），在这个情况下，`findDOMNode` 会返回第一个非空子节点对应的 DOM 节点。
 
 > 注意:
 >

From 417e0df5612ca1e7d3decb01f61a227058ed4871 Mon Sep 17 00:00:00 2001
From: Ryanhui <ryanhui1996@gmail.com>
Date: Wed, 6 Mar 2019 21:01:10 +0800
Subject: [PATCH 4/7] modify

---
 content/docs/reference-react-dom.md | 54 ++++++++++++++++-------------
 1 file changed, 30 insertions(+), 24 deletions(-)

diff --git a/content/docs/reference-react-dom.md b/content/docs/reference-react-dom.md
index 523fc0f08f..b7fcf469fb 100644
--- a/content/docs/reference-react-dom.md
+++ b/content/docs/reference-react-dom.md
@@ -6,11 +6,11 @@ category: Reference
 permalink: docs/react-dom.html
 ---
 
-如果你使用一个 `<script>` 标签引入 React ，所有的顶层 API 都能在全局 `ReactDOM` 上调用。如果你使用 npm 和 ES6 ，你可以用 `import ReactDOM from 'react-dom'` 。如果你使用 npm 和 ES5 ，你可以用 `var ReactDOM = require('react-dom')` 。
+如果你使用一个 `<script>` 标签引入 React，所有的顶层 API 都能在全局 `ReactDOM` 上调用。如果你使用 npm 和 ES6，你可以用 `import ReactDOM from 'react-dom'`。如果你使用 npm 和 ES5，你可以用 `var ReactDOM = require('react-dom')`。
 
-## 概述 {#overview}
+## 概览 {#overview}
 
-`react-dom` 包提供了可在应用顶层使用的针对 DOM（DOM-specific）的方法，如果有需要，你可以把这些方法用作到 React 模型外面的逃生出口。不过一般情况下，你的大部分组件都不需要使用这个模块。
+`react-dom` 的 package 提供了可在应用顶层使用的 DOM（DOM-specific）方法，如果有需要，你可以把这些方法用于 React 模型以外的地方。不过一般情况下，大部分组件都不需要使用这个模块。
 
 - [`render()`](#render)
 - [`hydrate()`](#hydrate)
@@ -20,11 +20,11 @@ permalink: docs/react-dom.html
 
 ### 浏览器支持 {#browser-support}
 
-React 支持所有的现代浏览器，包括 IE9 及以上版本，但是需要为老浏览器比如 IE9 和 IE10 引入[一些 polyfills](/docs/javascript-environment-requirements.html) 。
+React 支持所有的现代浏览器，包括 IE9 及以上版本，但是需要为旧版浏览器比如 IE9 和 IE10 引入[相关的 polyfills 依赖](/docs/javascript-environment-requirements.html)。
 
 > 注意：
 >
->我们不支持那些不兼容 ES5 方法的老浏览器，但如果你的应用包含了 polyfill ，例如 [es5-shim and es5-sham](https://github.com/es-shims/es5-shim) 你可能会发现你的应用仍然可以在这些浏览器中正常运行。不过如果你选择这种方法，你便需要孤军奋战了。
+>我们不支持那些不兼容 ES5 方法的旧版浏览器，但如果你的应用包含了 polyfill，例如 [es5-shim 和 es5-sham](https://github.com/es-shims/es5-shim) 你可能会发现你的应用仍然可以在这些浏览器中正常运行。但是如果你选择这种方法，你便需要孤军奋战了。
 
 * * *
 
@@ -36,21 +36,23 @@ React 支持所有的现代浏览器，包括 IE9 及以上版本，但是需要
 ReactDOM.render(element, container[, callback])
 ```
 
-在提供的 `container` 里渲染一个 React 元素，返回一个这个组件的[引用](/docs/more-about-refs.html)（或者为[无状态组件](/docs/components-and-props.html#functional-and-class-components)返回 `null`）。
+在提供的 `container` 里渲染一个 React 元素，并返回对该组件的[引用](/docs/more-about-refs.html)（或者针对[无状态组件](/docs/components-and-props.html#functional-and-class-components)返回 `null`）。
 
-如果 React 元素之前已经在 `container` 里渲染过，这将会进行一次更新，并且只会在必要时改变 DOM 来体现最新的 React 元素。
+如果 React 元素之前已经在 `container` 里渲染过，这将会对其执行更新操作，并仅会在必要时改变 DOM 以映射最新的 React 元素。
 
-如果提供了可选的回调函数，回调将在组件被渲染或更新之后执行。
+如果提供了可选的回调函数，该回调将在组件被渲染或更新之后被执行。
 
 > 注意：
 >
-> `ReactDOM.render()` 会控制你提供的容器节点里的内容。当第一次调用时，容器节点里的所有 DOM 元素都会被替换，后续的调用则会使用 React 的 DOM 差分算法（DOM diffing algorithm）进行高效的更新。
+> `ReactDOM.render()` 会控制你传入容器节点里的内容。当首次调用时，容器节点里的所有 DOM 元素都会被替换，后续的调用则会使用 React 的 DOM 差分算法（DOM diffing algorithm）进行高效的更新。
 >
-> `ReactDOM.render()` 不会修改容器节点（只会修改容器的子节点）。你可以在不覆盖已有子节点的情况下添加一个组件到已有的 DOM 节点中去。
+> `ReactDOM.render()` 不会修改容器节点（只会修改容器的子节点）。可以在不覆盖现有子节点的情况下，将组件插入已有的 DOM 节点中。
 >
-> `ReactDOM.render()` 目前会返回一个指向根 `ReactComponent` 实例的引用。但是使用返回值的这种写法来自历史遗留并且应该避免，因为在未来版本的 React 中，组件的渲染在某些情况下会是异步的。如果你真的需要一个指向根 `ReactComponent` 实例的引用，推荐的方法是添加一个 [callback ref](/docs/more-about-refs.html#the-ref-callback-attribute) 到根元素上。
+> `ReactDOM.render()` 目前会返回对根组件 `ReactComponent` 实例的引用。
+> 但是，目前应该避免使用返回的引用，因为它是历史遗留下来的内容，而且在未来版本的 React 中，组件渲染在某些情况下可能会是异步的。
+> 如果你真的需要获得对根组件 `ReactComponent` 实例的引用，那么推荐为根元素添加 [callback ref](/docs/more-about-refs.html#the-ref-callback-attribute)。
 >
-> 使用 `ReactDOM.render()` 混合服务端渲染的容器已经废弃了，并且会在 React 17 被移除。作为替代，使用 [`hydrate()`](#hydrate)。
+> 使用 `ReactDOM.render()` 对服务端渲染容器进行 hydrate 操作的方式已经被废弃，并且会在 React 17 被移除。作为替代，请使用 [`hydrate()`](#hydrate)。
 
 * * *
 
@@ -60,15 +62,16 @@ ReactDOM.render(element, container[, callback])
 ReactDOM.hydrate(element, container[, callback])
 
 ```
-和 [`render()`](#render) 相同，用来混合由 [`ReactDOMServer`](/docs/react-dom-server.html) 渲染 HTML 内容的容器。React 会尝试在已有标记上绑定事件监听器。
+与 [`render()`](#render) 相同，但它用于在 [`ReactDOMServer`](/docs/react-dom-server.html) 渲染的容器中对 HTML 的内容进行 hydrate 操作。React 会尝试在已有标记上绑定事件监听器。
 
-React 期望服务端和客户端渲染的内容完全一致。React 可以弥补文本内容的差异，但是你需要将不匹配的地方作为 bug 进行修复。在开发者模式，React 会对混合过程中的不匹配进行警告。不过不能保证在不匹配的情况下，属性的不同会被修补。在性能原因上这很重要，因为大多是应用很少有不匹配的情况，所以验证所有的标记将会造成过于昂贵的性能开销。
+React 希望服务端与客户端渲染的内容完全一致。React 可以弥补文本内容的差异，但是你需要将不匹配的地方作为 bug 进行修复。在开发者模式下，React 会对 hydration 操作过程中的不匹配进行警告。但并不能保证在不匹配的情况下，修补属性的差异。由于性能的关系，这一点非常重要，因为大多是应用中不匹配的情况很少见，并且验证所有标记的成本非常昂贵。
 
-如果一个单一元素的属性或者文本内容，在服务端和客户端之间不可避免的不同（比如：时间戳），你可以为元素添加 `suppressHydrationWarning={true}` 隐藏警告。这种方式只在一层深度上有效，而且应只作为一个逃生窗口（escape hatch）。除非是文本内容，否则不要滥用，React 不会尝试修补不同，所以在未来的更新以前，仍会保持不一致。
+如果单个元素的属性或者文本内容，在服务端和客户端之间有无法避免差异（比如：时间戳），则可以为元素添加 `suppressHydrationWarning={true}` 来消除警告。这种方式只在一级深度上有效，应只作为一种应急方案（escape hatch）。请不要过度使用！除非它是文本内容，否则 React 仍不会尝试修补差异，因此在未来的更新之前，仍会保持不一致。
 
-如果你刻意的在服务端与客户端渲染不同内容，你可以采用两遍（two-pass）渲染。在客户端渲染不同内容的组件可以读取一个 state 变量，例如 `this.state.isClient` ，你可以在 `componentDidMount()` 里将它设置为 `true` 。这种方式在初始渲染时会和服务端渲染相同的内容，避免不同。混合之后，另外的操作会同步进行。 注意，因为进行了两次渲染，这种实现会使你的组件变慢，请小心使用。
+如果你执意要在服务端与客户端渲染不同内容，你可以采用双重（two-pass）渲染。在客户端渲染不同内容的组件可以读取类似于 `this.state.isClient` 的 state 变量，你可以在 `componentDidMount()` 里将它设置为 `true`。这种方式在初始渲染过程中会与服务端渲染相同的内容，从而避免不匹配的情况出现，但在 hydration 操作之后，会同步进行额外的渲染操作。注意，因为进行了两次渲染，这种方式会使得组件渲染变慢，请小心使用。
 
-记得留意弱网络环境下的用户体验，JavaScript 代码的加载可能比初始 HTML 渲染晚的多。所以如果你只在客户端渲染不同的内容，其变化可能会有冲突。但是，如果执行顺利，在服务端渲染外壳（shell）也许是有益的，并且只需在客户端显示额外的小组件。要了解如何在避免不匹配标记问题下实现，请参考上一段的解释。
+
+记得保证弱网环境下的用户体验。JavaScript 代码的加载要比最初的 HTML 渲染晚的多。因此如果你只在客户端渲染不同的内容，其转换可能会不稳定。但是，如果执行顺利，那么在服务端负责渲染的 shell 会对渲染提供帮助，并且只显示客户端上额外的小组件。欲了解如何在不出现标记不匹配的情况下执行此操作，请参考上一段的解释。
 
 * * *
 
@@ -77,28 +80,30 @@ React 期望服务端和客户端渲染的内容完全一致。React 可以弥
 ```javascript
 ReactDOM.unmountComponentAtNode(container)
 ```
-从 DOM 中移除一个已经挂载的组件，并且清除其事件处理器（event handlers）和 state 。如果指定容器上没有已挂载组件，这个函数什么也不会做。如果组件被移除将会返回 `true` ，如果没有组件可被移除将会返回 `false` 。
+
+从 DOM 中卸载组件，会将其事件处理器（event handlers）和 state 一并清除。如果指定容器上没有对应已挂载的组件，这个函数什么也不会做。如果组件被移除将会返回 `true`，如果没有组件可被移除将会返回 `false`。
 
 * * *
 
 ### `findDOMNode()` {#finddomnode}
 
 > 注意:
-> `findDOMNode` 是一个访问底层 DOM 节点的逃生窗口（escape hatch）。在大多数情况下，不鼓励使用这个方法，因为它会穿透组件的抽象结构。[严格模式下这个方法已经弃用。](/docs/strict-mode.html#warning-about-deprecated-finddomnode-usage)
+>
+> `findDOMNode` 是一个访问底层 DOM 节点的应急方案（escape hatch）。在大多数情况下，不推荐使用该方法，因为它会破坏组件的抽象结构。[严格模式下该方法已弃用。](/docs/strict-mode.html#warning-about-deprecated-finddomnode-usage)
 
 
 ```javascript
 ReactDOM.findDOMNode(component)
 ```
-如果组件已经被挂载到 DOM 上，这个方法会返回相应的原生浏览器 DOM 元素。这个方法对于从 DOM 中读取值很有用，例如表单字段的值和执行 DOM 测量（performing DOM measurements）。**大多数情况下，你可以绑定一个 ref 到 DOM 节点上，完全避免使用 findDOMNode。**
+如果组件已经被挂载到 DOM 上，此方法会返回浏览器中相应的原生 DOM 元素。此方法对于从 DOM 中读取值很有用，例如获取表单字段的值或者执行 DOM 检测（performing DOM measurements）。**大多数情况下，你可以绑定一个 ref 到 DOM 节点上，可以完全避免使用 findDOMNode。**
 
-当一个组件渲染的内容是 `null` 或者 `false` 时， `findDOMNode` 返回的是 `null` 。当一个组件渲染的是字符串时，`findDOMNode` 返回的包含这个值的文本 DOM 节点。从 React 16 开始，一个组件可能会返回有多个子节点的碎片（fragment），在这个情况下，`findDOMNode` 会返回第一个非空子节点对应的 DOM 节点。
+当组件渲染的内容为 `null` 或 `false` 时，`findDOMNode` 也会返回 `null`。当组件渲染的是字符串时，`findDOMNode` 返回的是字符串对应的 DOM 节点。从 React 16 开始，组件可能会返回有多个子节点的 fragment，在这种情况下，`findDOMNode` 会返回第一个非空子节点对应的 DOM 节点。
 
 > 注意:
 >
-> `findDOMNode` 只在挂载的组件上可用（即，已经放置在 DOM 中的组件）。如果你尝试调用一个未挂载的组件（例如在一个还未创建的组件上调用 `render()` 中的 `findDOMNode()`）将会引发异常。
+> `findDOMNode` 只在已挂载的组件上可用（即，已经放置在 DOM 中的组件）。如果你尝试调用未挂载的组件（例如在一个还未创建的组件上调用 `render()` 中的 `findDOMNode()`）将会引发异常。
 > 
-> `findDOMNode` 不能用于函数式组件。
+> `findDOMNode` 不能用于函数组件。
 
 * * *
 
@@ -107,4 +112,5 @@ ReactDOM.findDOMNode(component)
 ```javascript
 ReactDOM.createPortal(child, container)
 ```
-创建一个入口。入口提供了一种[将子节点渲染到 DOM 节点中的方法，该节点存在于 DOM 组件的层次结构之外](/docs/portals.html)。
+
+创建 portal。[Portal](/docs/portals.html) 将提供一种将子节点渲染到 DOM 节点中的方式，该节点存在于 DOM 组件的层次结构之外。

From 97b19905794cfde10ab3adfd2a7177e20faecd53 Mon Sep 17 00:00:00 2001
From: QiChang Li <github@liqichang.com>
Date: Thu, 7 Mar 2019 09:49:48 +0800
Subject: [PATCH 5/7] Update reference-react-dom.md

---
 content/docs/reference-react-dom.md | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/content/docs/reference-react-dom.md b/content/docs/reference-react-dom.md
index b7fcf469fb..371a2511df 100644
--- a/content/docs/reference-react-dom.md
+++ b/content/docs/reference-react-dom.md
@@ -60,8 +60,8 @@ ReactDOM.render(element, container[, callback])
 
 ```javascript
 ReactDOM.hydrate(element, container[, callback])
-
 ```
+
 与 [`render()`](#render) 相同，但它用于在 [`ReactDOMServer`](/docs/react-dom-server.html) 渲染的容器中对 HTML 的内容进行 hydrate 操作。React 会尝试在已有标记上绑定事件监听器。
 
 React 希望服务端与客户端渲染的内容完全一致。React 可以弥补文本内容的差异，但是你需要将不匹配的地方作为 bug 进行修复。在开发者模式下，React 会对 hydration 操作过程中的不匹配进行警告。但并不能保证在不匹配的情况下，修补属性的差异。由于性能的关系，这一点非常重要，因为大多是应用中不匹配的情况很少见，并且验证所有标记的成本非常昂贵。
@@ -91,7 +91,6 @@ ReactDOM.unmountComponentAtNode(container)
 >
 > `findDOMNode` 是一个访问底层 DOM 节点的应急方案（escape hatch）。在大多数情况下，不推荐使用该方法，因为它会破坏组件的抽象结构。[严格模式下该方法已弃用。](/docs/strict-mode.html#warning-about-deprecated-finddomnode-usage)
 
-
 ```javascript
 ReactDOM.findDOMNode(component)
 ```

From ce6fdc5ed7e9115f406b47936445be7c6c5a7036 Mon Sep 17 00:00:00 2001
From: QiChang Li <github@liqichang.com>
Date: Thu, 7 Mar 2019 09:50:16 +0800
Subject: [PATCH 6/7] Update reference-react-dom.md

---
 content/docs/reference-react-dom.md | 1 -
 1 file changed, 1 deletion(-)

diff --git a/content/docs/reference-react-dom.md b/content/docs/reference-react-dom.md
index 371a2511df..c9423179d1 100644
--- a/content/docs/reference-react-dom.md
+++ b/content/docs/reference-react-dom.md
@@ -70,7 +70,6 @@ React 希望服务端与客户端渲染的内容完全一致。React 可以弥
 
 如果你执意要在服务端与客户端渲染不同内容，你可以采用双重（two-pass）渲染。在客户端渲染不同内容的组件可以读取类似于 `this.state.isClient` 的 state 变量，你可以在 `componentDidMount()` 里将它设置为 `true`。这种方式在初始渲染过程中会与服务端渲染相同的内容，从而避免不匹配的情况出现，但在 hydration 操作之后，会同步进行额外的渲染操作。注意，因为进行了两次渲染，这种方式会使得组件渲染变慢，请小心使用。
 
-
 记得保证弱网环境下的用户体验。JavaScript 代码的加载要比最初的 HTML 渲染晚的多。因此如果你只在客户端渲染不同的内容，其转换可能会不稳定。但是，如果执行顺利，那么在服务端负责渲染的 shell 会对渲染提供帮助，并且只显示客户端上额外的小组件。欲了解如何在不出现标记不匹配的情况下执行此操作，请参考上一段的解释。
 
 * * *

From 1c9948dfa5ebd2a8547c8fd22d38817c22b9f58d Mon Sep 17 00:00:00 2001
From: QiChang Li <github@liqichang.com>
Date: Thu, 7 Mar 2019 09:50:40 +0800
Subject: [PATCH 7/7] Update reference-react-dom.md

---
 content/docs/reference-react-dom.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/content/docs/reference-react-dom.md b/content/docs/reference-react-dom.md
index c9423179d1..d696180562 100644
--- a/content/docs/reference-react-dom.md
+++ b/content/docs/reference-react-dom.md
@@ -100,7 +100,7 @@ ReactDOM.findDOMNode(component)
 > 注意:
 >
 > `findDOMNode` 只在已挂载的组件上可用（即，已经放置在 DOM 中的组件）。如果你尝试调用未挂载的组件（例如在一个还未创建的组件上调用 `render()` 中的 `findDOMNode()`）将会引发异常。
-> 
+>
 > `findDOMNode` 不能用于函数组件。
 
 * * *