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

我尝试过直接将脚本直接添加到渲染中，它将短暂加载iframe，然后切换回script标签 

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;

#1楼 票数：0

请注意控制台中显示的警告： 

Failed to execute 'write' on 'Document': It isn't possible to write into a document from an asynchronously-loaded external script unless it is explicitly opened.

请参阅对文档执行写入：除非已明确打开，否则无法从异步加载的外部脚本写入文档。

  ask by user3924059 translate from so

未解决问题？本站智能推荐：

1回复

无法使用useEffect钩子对未安装的组件执行React状态更新

我有 它给了我 警告：无法对卸载的组件执行 React 状态更新。 这是一个空操作，但它表明您的应用程序中存在内存泄漏。 要修复，请取消 useEffect 清理函数中的所有订阅和异步任务。 好的，问题不是如何解决它。 当我在axios承诺之后使用 setLoading(false) 时它工作正常但
3回复

React：useEffect“悖论”与eventHandler道具

这个例子有问题。 我有一个Input组件。 这个输入组件有一个onChange属性来处理内部的任何数据更改。 应该是，如果我从外部更新value ，则不会触发onChange道具，因为输入组件内部没有任何更改。 如果你开始输入onChange道具就会被触发，我也可以从外部更新状态。 但是如果满足某
1回复

React.useEffect不清理

我有一个用于检测外部点击的自定义反应钩子。function useOutsideClick(ref, onOutsideClick) { useEffect(() => { const onClick = event => { if (!ref.current?.con
1回复

更新请求后如何触发useEffect重新渲染

我有一个初始状态，在发出 HTTP 请求后，我使用请求中的值更新初始状态。 当用户更新这些值时，我会发出另一个 HTTP 请求来更新这些值。 我有一个 useEffect 从中获取数据以更新初始状态值。 在那个 useEffect 中，如果我添加状态依赖项，它会导致无限循环。 由于我的表单字段很多
2回复

如何阻止React.useEffect的副作用？[复制]

这个问题在这里已经有了答案： 停止 useEffect 在 mount 上运行（2 个回答） 3 个月前关闭。 一旦我继续在我的网络应用程序中路由/log
1回复

useEffect不断地触发GET请求

我正在学习 React 并尝试自己做一个小项目，但是我在使用useEffect遇到了useEffect 。 我正在尝试使用来自后端的信息自动填充表单。 我可以让它自动填充，但它不断发送 GET 请求。 这就是我所拥有的： useEffect(() => { axios
2回复

React组件的返回依赖于来自useEffect的数据

旧标题：React useEffect 不会在页面重新加载时运行useEffect(()=>{console.log("I ran")}, []) // should run once 如果我导航到包含该组件的页面，它确实会运行，但如果我重新加载该页面，它就不会再次运行。 即使我重新加载页面，
2回复

React.js：useEffect()依赖冻结了我的应用

当用户之前没有选择任何产品时，我试图显示模态。 我最终得到了useEffect()依赖的无限循环。 我不确定如何在 React 中正确地做到这一点。 我可以从依赖项中删除setCurrentModal ，但我收到警告。 如果我添加它，我的 React 应用程序就会冻结。 如何组织我的代码以避免冻结？