我在react项目中调用第三方javascript时遇到问题。
我在正文标签内的index.html文件中这样调用
<body>
<script src="https://zwibbler.com/zwibbler-demo.js"></script>
</body
我也调用了<head>标签中的脚本，但这也不起作用。
我能够在我新创建的react应用程序中成功地获取并使用它，但当我将它集成到我现有的react项目中时，脚本显示它已加载在网络选项卡中，但不会呈现输出。我该怎么加载它？
我也调用了componentDidMount中的脚本，如下所示，但这不起作用。
用于componentDidMount:
componentDidMount(){
const script = document.createElement("script");
script.src = "https://zwibbler.com/zwibbler-demo.js";
document.body.appendChild(script);
}
我使用它的组件(第三方库(在两到三个路由之后出现，这意味着用户必须执行一些操作/事件才能渲染该组件，所以是因为这些事件，我不能使用库吗？或者简单地说，当组件加载时，我该如何调用该脚本？我已经试过componentWill/DidMount()了。
我得到了解决方案，感谢大家的帮助和支持解决方案是，我不必担心脚本被加载，我只需要在index.html中调用一个脚本，然后我就可以像这个一样编写我的组件
class ZwibblerComponent extends React.Component {
render() {
return (
<div>
Some sample buttons<br />
<button onClick={() => this.ctx.useBrushTool()}>Brush</button>
<button onClick={() => this.ctx.download("zwibbler3", "drawing.zwibbler")}>Save to computer</button>
<button onClick={() => this.ctx.openFromComputer()}>Open from computer</button>
<div ref={el => this.el = el}
style={{ width: "500px", height: "500px" }}>
</div>
</div>
)
}
componentDidMount() {
this.ctx = Zwibbler.create(this.el, {
setFocus: false,
showToolbar: false,
})
}
componentWillUnmount() {
this.ctx.destroy();
console.log("Destroying");
}
}
啊。。。终于解决了，如果有人在react.js中寻找zwibler实现……伙计们。