时间戳

首页 > 解决方案 > 在 React SSR 中渲染 Fushion 图表

javascript - 在 React SSR 中渲染 Fushion 图表

问题描述

有什么方法可以在服务器端渲染图表吗？. ReferenceError: document is not defined通过快速服务器启动反应应用程序时出现此错误。

标签： javascriptreactjschartsserver-side-rendering

解决方案

我在这里猜测，但是如果您使用的图表库仅依赖于客户端上的功能，例如window，您可以简单地检查组件是否已实际安装。有很多方法可以做到这一点。如果您正在编写功能组件，例如，您可以这样做：

const [isClient, setIsClient] = useState(false);

useEffect(() => {
  setIsClient(true);
}, [])

return isClient ? (<SomeFusionChart/>) : (<SomePlaceHolder/>

在功能组件中，或将其分离到自定义钩子中。

你也可以做

(typeof window !== 'undefined') ? (<SomeFusionChart/>) : (<SomePlaceHolder/>

推荐阅读