首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >Remix.run与融合图

Remix.run与融合图
EN

Stack Overflow用户
提问于 2022-06-22 09:20:58
回答 1查看 324关注 0票数 0

react-fusioncharts应用程序中使用Remix.run似乎不起作用吗?有什么解决办法吗?

ReactFC.fcRoot(FusionCharts, Column2D, GammelTheme)

我得到了一个错误:

ReferenceError: document is not defined

这是有意义的,因为Remix使用SSR,但是即使我使用这个安全防护,它也失败了(来自混合文档的推荐方法):

代码语言:javascript
运行
复制
if (typeof document !== 'undefined') {
    ReactFC.fcRoot(FusionCharts, Column2D, GammelTheme)
}
EN

回答 1

Stack Overflow用户

发布于 2022-06-22 09:49:25

组件需要包装在来自ClientOnlyremix-utils组件中。这样,组件将只呈现在客户端上,而不会被服务器呈现.

代码语言:javascript
运行
复制
// components/chart.jsx
import * as ReactFS from 'fusionchart'

export default function Chart() {
  // this component will only render on the client
  // and will not be server rendered
  return (
    {/* fusion chart components */}
  )
}

// routes/index.tsx
import {ClientOnly} from 'remix-utils'
import Chart from '~/components/chart'

export default function() {
  return (
    <ClientOnly fallback={<LoadingSkeleton />}
      {() => <Chart />}
    </ClientOnly>
  )
}
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/72712859

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档