我正在尝试使用脚本标签动态加载脚本。但我做不到。
我的渲染方法如下
render() {
<div>
<script type="text/javascript" language="javascript" src="//verify.authorize.net/anetseal/seal.js" ></script>
<a href="http://www.authorize.net/" id="AuthorizeNetText" target="_blank">Working. Yipee</a>
</div>
}
我尝试使用危险的SetInnerHtml 但这也不起作用。
我需要这样做是因为，提到的脚本使用了 document.writeln。所以我希望它显示在这个当前的 div 中。我无法控制脚本。它来自第三方。
我相信您可以更具体地了解加载脚本后应该做什么。像这样的东西应该很适合你：
componentDidMount() {
var aScript = document.createElement('script');
aScript.type = 'text/javascript';
aScript.src = " /*URL Goes Here*/ ";
document.head.appendChild(aScript);
aScript.onload = function() {
document.getElementById(" /*DIV ID HERE*/ ").InnerHTML = /*YOUR CODE*/;
};
}
你可以script像这样将标签附加到你的身体上：
componentDidMount() {
var addScript = document.createElement('script');
addScript.setAttribute('src', '//verify.authorize.net/anetseal/seal.js');
document.body.appendChild(addScript);
}
render() {
return (
<div>
<a href="http://www.authorize.net/" id="AuthorizeNetText" target="_blank">Working. Yipee</a>
</div>
);
}
您可以尝试使用 Helmet，https://github.com/nfl/react-helmet
render() {
<div>
<Helmet>
<script type="text/javascript" language="javascript" src="//verify.authorize.net/anetseal/seal.js" />
<Helmet>
<a href="http://www.authorize.net/" id="AuthorizeNetText" target="_blank">Working. Yipee</a>
</div>
}