renderToStaticMarkup

const html = renderToStaticMarkup(reactNode, options?)

• 参考
  • renderToStaticMarkup(reactNode, options?)
• 用法
  • 将非交互式 React 树作为 HTML 渲染为字符串

参考

renderToStaticMarkup(reactNode, options?)

在服务器上，调用 renderToStaticMarkup 将您的应用程序渲染为 HTML。

import { renderToStaticMarkup } from 'react-dom/server';

const html = renderToStaticMarkup(<Page />);

它将生成 React 组件的非交互式 HTML 输出。

请参阅下面的更多示例。

参数

• reactNode：要渲染为 HTML 的 React 节点。例如，JSX 节点，如 <Page />。
• 可选 options：用于服务器渲染的对象。
  • 可选 identifierPrefix：React 用于 useId 生成的 ID 的字符串前缀。在同一页面上使用多个根节点时，这对于避免冲突很有用。

返回值

HTML 字符串。

注意事项

• 无法对 renderToStaticMarkup 的输出进行水合。

• renderToStaticMarkup 对 Suspense 的支持有限。如果组件挂起，renderToStaticMarkup 会立即将其回退内容作为 HTML 发送。

• renderToStaticMarkup 可以在浏览器中运行，但不建议在客户端代码中使用它。如果需要在浏览器中将组件渲染为 HTML，请将其渲染到 DOM 节点中以获取 HTML。

用法

import { renderToStaticMarkup } from 'react-dom/server';

// The route handler syntax depends on your backend framework
app.use('/', (request, response) => {
  const html = renderToStaticMarkup(<Page />);
  response.send(html);
});