如何检测您的React应用程序是否已在服务器上呈现？

Question

我想在组件中确定我的React应用程序是否构建为与校验和进行比较或正常呈现。有没有办法让一个组件在初始＆＃34;校验和＆＃34;上行为略有不同？呈现？

具体来说，我有一个使用canvas的组件，服务器无法做到。所以在服务器上，我希望它只是渲染一个空元素，然后在客户端上匹配校验和并随后更新。

或者在这样的情况下，让React替换服务器使用新元素渲染的元素会更好吗？

Answer 1

要检查环境，我使用一个简单的辅助函数：

isBrowser = () => typeof window !== 'undefined' && window.document !== undefined;

这很有效，因为window和window.document是特定于浏览器的对象。使用此帮助程序，您可以拥有特定于浏览器/服务器的行为。