diff --git a/src/content/reference/react-dom/server/renderToString.md b/src/content/reference/react-dom/server/renderToString.md
index 41bc6a9828..f98d6f5325 100644
--- a/src/content/reference/react-dom/server/renderToString.md
+++ b/src/content/reference/react-dom/server/renderToString.md
@@ -4,13 +4,13 @@ title: renderToString
-`renderToString` does not support streaming or waiting for data. [See the alternatives.](#alternatives)
+`renderToString` 不支持流式传输或等待数据。[请参考替代方案](#alternatives)。
-`renderToString` renders a React tree to an HTML string.
+`renderToString` 将 React 树渲染为一个 HTML 字符串。
```js
const html = renderToString(reactNode)
@@ -26,7 +26,7 @@ const html = renderToString(reactNode)
### `renderToString(reactNode)` {/*rendertostring*/}
-On the server, call `renderToString` to render your app to HTML.
+在服务器,调用 `renderToString` 将你的应用渲染为 HTML。
```js
import { renderToString } from 'react-dom/server';
@@ -34,81 +34,81 @@ import { renderToString } from 'react-dom/server';
const html = renderToString();
```
-On the client, call [`hydrateRoot`](/reference/react-dom/client/hydrateRoot) to make the server-generated HTML interactive.
+在客户端,调用 [`hydrateRoot`](/reference/react-dom/client/hydrateRoot) 来使服务器生成的 HTML 具有交互性。
-[See more examples below.](#usage)
+[请参考下面的更多示例](#usage)。
#### Parameters {/*parameters*/}
-* `reactNode`: A React node you want to render to HTML. For example, a JSX node like ``.
+* `reactNode`:你要渲染为 HTML 的 React 节点。例如,一个 JSX 节点,就像 ``。
-#### Returns {/*returns*/}
+#### 返回值 {/*returns*/}
-An HTML string.
+一个 HTML 字符串。
-#### Caveats {/*caveats*/}
+#### 注意事项 {/*caveats*/}
-* `renderToString` has limited Suspense support. If a component suspends, `renderToString` immediately sends its fallback as HTML.
+* `renderToString` 对 Suspense 的支持有限。如果一个组件挂起(suspend),`renderToString` 会立即将其 fallback 作为 HTML 发送。
-* `renderToString` works in the browser, but using it in the client code is [not recommended.](#removing-rendertostring-from-the-client-code)
+* `renderToString` 可以在浏览器中工作,但 [不推荐](#removing-rendertostring-from-the-client-code) 在客户端代码中使用它。
---
-## Usage {/*usage*/}
+## 用法 {/*usage*/}
-### Rendering a React tree as HTML to a string {/*rendering-a-react-tree-as-html-to-a-string*/}
+### 将 React 树渲染为 HTML 字符串 {/*rendering-a-react-tree-as-html-to-a-string*/}
-Call `renderToString` to render your app to an HTML string which you can send with your server response:
+调用 `renderToString` 将你的应用渲染为 HTML 字符串,你可以将其与服务器响应一起发送:
```js {5-6}
import { renderToString } from 'react-dom/server';
-// The route handler syntax depends on your backend framework
+// 路由处理程序的语法取决于你使用的后端框架
app.use('/', (request, response) => {
const html = renderToString();
response.send(html);
});
```
-This will produce the initial non-interactive HTML output of your React components. On the client, you will need to call [`hydrateRoot`](/reference/react-dom/client/hydrateRoot) to *hydrate* that server-generated HTML and make it interactive.
+这将生成你的 React 组件的初始非交互式 HTML 输出。在客户端上,你需要调用 [`hydrateRoot`](/reference/react-dom/client/hydrateRoot) 来将服务器生成的 HTML 进行 hydrate 处理,使其具有交互功能。
-`renderToString` does not support streaming or waiting for data. [See the alternatives.](#alternatives)
+`renderToString` 不支持流式传输或等待数据。[请参考替代方案](#alternatives)。
---
-## Alternatives {/*alternatives*/}
+## 替代方案 {/*alternatives*/}
-### Migrating from `renderToString` to a streaming method on the server {/*migrating-from-rendertostring-to-a-streaming-method-on-the-server*/}
+### 从 `renderToString` 迁移到服务器上的流式传输方法 {/*migrating-from-rendertostring-to-a-streaming-method-on-the-server*/}
-`renderToString` returns a string immediately, so it does not support streaming or waiting for data.
+`renderToString` 立即返回一个字符串,因此不支持流式传输或等待数据。
-When possible, we recommend using these fully-featured alternatives:
+如果可能的话,我们建议使用这些功能完整的替代方法:
-* If you use Node.js, use [`renderToPipeableStream`.](/reference/react-dom/server/renderToPipeableStream)
-* If you use Deno or a modern edge runtime with [Web Streams](https://developer.mozilla.org/en-US/docs/Web/API/Streams_API), use [`renderToReadableStream`.](/reference/react-dom/server/renderToReadableStream)
+* 如果你使用 Node.js,请使用 [`renderToPipeableStream`](/reference/react-dom/server/renderToPipeableStream)。
+* 如果你使用 Deno 或支持 [Web Streams](https://developer.mozilla.org/en-US/docs/Web/API/Streams_API) 的现代运行时,请使用 [`renderToReadableStream`](/reference/react-dom/server/renderToReadableStream)。
-You can continue using `renderToString` if your server environment does not support streams.
+如果你的服务器环境不支持流式传输,你仍然可以继续使用 `renderToString`。
---
-### Removing `renderToString` from the client code {/*removing-rendertostring-from-the-client-code*/}
+### 从客户端代码中移除 `renderToString` {/*removing-rendertostring-from-the-client-code*/}
-Sometimes, `renderToString` is used on the client to convert some component to HTML.
+有时,`renderToString` 用于在客户端将某个组件转换为 HTML。
```js {1-2}
-// 🚩 Unnecessary: using renderToString on the client
+// 🚩 不必要:在客户端使用 renderToString
import { renderToString } from 'react-dom/server';
const html = renderToString();
-console.log(html); // For example, ""
+console.log(html); // 例如,""
```
-Importing `react-dom/server` **on the client** unnecessarily increases your bundle size and should be avoided. If you need to render some component to HTML in the browser, use [`createRoot`](/reference/react-dom/client/createRoot) and read HTML from the DOM:
+在客户端导入 `react-dom/server` 会不必要地增加 bundle 大小,所以应该避免这样做。如果你需要在浏览器中将某个组件渲染为 HTML,请使用 [`createRoot`](/reference/react-dom/client/createRoot) 并从 DOM 中读取 HTML。
```js
import { createRoot } from 'react-dom/client';
@@ -119,20 +119,20 @@ const root = createRoot(div);
flushSync(() => {
root.render();
});
-console.log(div.innerHTML); // For example, ""
+console.log(div.innerHTML); // 例如,""
```
-The [`flushSync`](/reference/react-dom/flushSync) call is necessary so that the DOM is updated before reading its [`innerHTML`](https://developer.mozilla.org/en-US/docs/Web/API/Element/innerHTML) property.
+[`flushSync`](/reference/react-dom/flushSync) 调用是必要的,以便在读取 [`innerHTML`](https://developer.mozilla.org/en-US/docs/Web/API/Element/innerHTML) 属性之前更新 DOM。
---
-## Troubleshooting {/*troubleshooting*/}
+## 故障排除 {/*troubleshooting*/}
-### When a component suspends, the HTML always contains a fallback {/*when-a-component-suspends-the-html-always-contains-a-fallback*/}
+### 当组件暂停时,HTML 中始终包含一个 fallback {/*when-a-component-suspends-the-html-always-contains-a-fallback*/}
-`renderToString` does not fully support Suspense.
+`renderToString` 不完全支持 Suspense。
-If some component suspends (for example, because it's defined with [`lazy`](/reference/react/lazy) or fetches data), `renderToString` will not wait for its content to resolve. Instead, `renderToString` will find the closest [``](/reference/react/Suspense) boundary above it and render its `fallback` prop in the HTML. The content will not appear until the client code loads.
+如果某个组件 suspend(例如,因为它使用 [`lazy`](/reference/react/lazy) 定义或获取数据),`renderToString` 不会等待其内容解析完成。相反,`renderToString` 将找到最近的 [``](/reference/react/Suspense) 边界,并在 HTML 中渲染其 `fallback` 属性。直到客户端代码加载后,内容才会显示出来。
-To solve this, use one of the [recommended streaming solutions.](#migrating-from-rendertostring-to-a-streaming-method-on-the-server) They can stream content in chunks as it resolves on the server so that the user sees the page being progressively filled in before the client code loads.
+要解决这个问题,请使用其中一个 [推荐的流式解决方案](#migrating-from-rendertostring-to-a-streaming-method-on-the-server)。它们可以在服务器上逐步以块的形式流式传输内容,使用户在客户端代码加载之前逐步看到页面填充。