javascript - react renderToString 不渲染 js

Question

如果我这样做

const clicked = () => console.log(“click”);

renderToString(<button onClick={clicked}>Click here</button>

当我打印出呈现的字符串时，我只看到 <button>Click here</button>

有没有可能这个函数没有渲染JS？

Answer 1

renderToString() 以纯 HTML 格式为您提供 React 应用程序，就像它在特定状态下的外观一样。它不会提供功能齐全的 React 应用。

JS 文档 renderToString() 说明如下:

Render a React element to its initial HTML. This should only be used on the server. React will return an HTML string. You can use this method to generate HTML on the server and send the markup down on the initial request for faster page loads and to allow search engines to crawl your pages for SEO purposes.

If you call ReactDOM.render() on a node that already has this server-rendered markup, React will preserve it and only attach event handlers, allowing you to have a very performant first-load experience.

这意味着 renderToString 将永远在输出中包含事件处理程序。它意味着您可以在服务器上生成处于特定状态的页面的原始 HTML，然后在浏览器上加载后，React 可以将这些元素重新组合为事件处理程序。