reactjs - 在 React 中，可以始终调用 ReactDOM. Hydro 而不是 ReactDOM.render 吗？

Question

我有如下代码，我在其中调用 ReactDOM.Hydrate。这是共享代码，有时从节点服务器调用，有时在客户端浏览器中调用。仅在客户端上调用它时，我是否需要做任何不同的事情(然后调用Hydrate)。通常，我会调用 render。

const render = Component => {
 ReactDOM.hydrate(
    <Router history={browserHistory}>
        <FullPage />
    </Router>,
    document.getElementById('root')
 )
}

渲染(应用程序)；

Answer 1

无论 HTML 是否具有服务器呈现的标记，

enchanted 在客户端的工作方式与 render 类似，但是当之前没有标记(例如不是 SSR)时，则 水合物 会产生一些警告，但是它会按预期呈现您的标记。解决此问题的更好方法是检查其 SSR(假设 root 作为您的父 div id):

var isMarkupPresent = document.getElementById('root').hasChildNodes();

然后您可以渲染或水合:

isMarkupPresent ? hydrate(...) ? render(...)