反应useEffect附加脚本未触发

Question

我正在尝试加载一个一旦触发就会生成 iframe 和天气小部件的脚本。我可以正确附加脚本，但它不会被调用并且不会生成 iframe

我试过直接在渲染中添加脚本，它会简单地加载 iframe 然后切换回脚本标签

const City = ({ content, schema }) => {

  useEffect(() => {

    let script = document.createElement("script");

    script.src =

  "https://darksky.net/widget/graph-bar/32.7174,-117.1628/us12/en.js?width=100%&height=400&title=Full Forecast&textColor=333333&bgColor=FFFFFF&transparency=false&skyColor=undefined&fontFamily=Default&customFont=&units=us&timeColor=333333&tempColor=ff8200&currentDetailsOption=true";

    script.async = true;

    document.getElementById("widget").appendChild(script);

  }, [])

  return (<div id="widget"></div>);

};

export default City;

Answer 1

注意控制台中显示的警告：Failed&nbsp;to&nbsp;execute&nbsp;'write'&nbsp;on&nbsp;'Document':&nbsp;It&nbsp;isn't&nbsp;possible&nbsp;to&nbsp;write&nbsp;into&nbsp;a&nbsp;document&nbsp;from&nbsp;an&nbsp;asynchronously-loaded&nbsp;external&nbsp;script&nbsp;unless&nbsp;it&nbsp;is&nbsp;explicitly&nbsp;opened.