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

小编典典

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

reactjs

我在调用的代码如下ReactDOM.hydrate。这是共享代码，有时会从节点服务器调用，有时会在客户端浏览器中调用。hydrate仅在客户端上调用时，是否需要做其他操作（然后调用）？通常，我会打电话给render。

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

render（App）;

阅读 741

2020-07-22

共1个答案

小编典典

hydrate``render无论HTML是否具有服务器呈现的标记，do的工作方式都类似于在客户端，但是如果以前没有像SSR那样没有标记，则会hydrate生成一些警告，但是它将按预期呈现标记。解决此问题的更好方法是检查其SSR（假定root为您的父div
ID）：

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

然后您可以render或hydrate：

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

2020-07-22