Javascript window.Calendally.initInlineWidget在首次加载时未定义，但在React和Gatsby中使用USEFFECT刷新后工作

我正在使用盖茨比与反应，并试图实施一个日历预订系统。这有点管用。问题是在第一次加载时，它给了我错误

TypeError:无法读取未定义的属性“initInlineWidget”

看到这里了吗

如果我刷新页面，Calendally对象就会加载并呈现得很好

我想知道我是否可以在useEffect中做些什么来避免这个问题

从“React”导入React，{useffect}
从“./组件/布局”导入布局
const Calendly=styled.div`
高度：800px；
边缘顶部：100px；
`
常量IndexPage=（{data}）=>{
useffect（（）=>{
window.Calendly.initInlineWidget({
url:“https://calendly.com/absolute-hardwood",
parentElement:document.getElementById（“bookingjs”），
前缀：{}，
utm:{}，
})
}, [])
返回(
)
}
导出默认索引扩展

下面是我如何在我的

gatsby confing.js

{
解析：“盖茨比插件加载脚本”，
选项：{
src:“https://assets.calendly.com/assets/external/widget.js",
},
}

马歇尔从Calendly来这里。因为您使用的是React和Gatsby，所以可以使用包在站点上加载内嵌嵌入

您需要在项目中安装该软件包，然后在文件顶部像这样导入InlineWidget：

import { InlineWidget } from "react-calendly";

然后，您可以使用页面上的组件：

<InlineWidget url="https://calendly.com/your_scheduling_page" />

---

我希望这有帮助！更多文档可在中找到。

谢谢，我将尝试并回复。谢谢again@AndersKitson很乐意帮忙！请让我知道，如果你有任何进一步的问题或如果你遇到任何错误的过程中。