Gatsby.js:有没有一种方法可以只在加载页面时呈现组件，而不在静态页面上

Question

我正在寻找一种方法，同时使用Gatsby.js React组件来防止某些部分在生成的静态页面上渲染，并且只在浏览器中加载页面时渲染：

<ThisComponentRenderedInStaticPages>
Content renered in static pages.
<SomeMagicTagPreventsChildrenToRenderOnStaticPages>
<ThisItemOnlyRendersOnPageLoad />
</SomeMagicTagPreventsChildrenToRenderOnStaticPages>
</ThisComponentRenderedInStaticPages>

我应该为这些编写一个单独的包，并将它们包含在react头盔元素中吗？

Answer 1

如果window是undefined，则在三元检查中包装不希望静态生成的组件。

typeof window === 'undefined' ? (
<div>I'm only generated in the browser.</div>
) : null}