如何使用iframe更新父级应用程序中的儿童应用程序的数据
我有一个React项目名称父母,该父母正在端口3000上运行,另一个在端口3001上运行的项目名称孩子。在儿童应用中,我有一个计数器按钮,该按钮 我使用iframe将其渲染在父级应用程序中。计数器工作正常,但儿童应用程序的价值没有更新。但是,我将其称为父项目。
Heare是我的代码
parents.js
return (
<div className="App">
This is Parent app
<Iframe url="http://localhost:3001/"
width="450px"
height="450px"
id="myId"
className="childApp"
/>
</div>
);
Child.js
const [number, setNumber] = useState(0)
return (
<div className="App">
This is Child app
{number}
<button onClick={() => setNumber(number + 1)}>Click me</button>
</div>
);
I have a react project name parent which is running on port 3000 and another project name child which is running on port 3001. In the child app, I have a counter button which
I rendered it inside the parent app using an iframe. The counter is working fine but the value of the child app is not updating. However, I am calling this the parent project.
Heare is my code
parents.js
return (
<div className="App">
This is Parent app
<Iframe url="http://localhost:3001/"
width="450px"
height="450px"
id="myId"
className="childApp"
/>
</div>
);
Child.js
const [number, setNumber] = useState(0)
return (
<div className="App">
This is Child app
{number}
<button onClick={() => setNumber(number + 1)}>Click me</button>
</div>
);
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论