首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >用useEffect进行强制重呈现

用useEffect进行强制重呈现
EN

Stack Overflow用户
提问于 2022-11-17 08:38:56
回答 4查看 45关注 0票数 2
代码语言:javascript
运行
复制
import * as React from "react";
// import "./style.css";

export default function App() {
      let [width, setWidth] = React.useState(window.innerWidth);
      let [height, setHeight] = React.useState(window.innerHeight);

      React.useEffect(() => {
        console.log("useEffect is called");
        window.addEventListener("resize", () => {
        setHeight(window.innerHeight);
        setWidth(window.innerWidth);
        });
      }, []);
 return (
      <div>
         {/* <button onClick={handler}> Submit </button> */}
         <h1>
         {" "}
            {height},{width}{" "}
          </h1>
      </div>
     );
   }

上面的代码导致重新呈现UI (height =windows.innerHeight & width = windows.innerWidth)上的高度、和宽度值,尽管使用的是带有空依赖项数组的useEffect。

我在useEffect中部署了useEffect来更新heightwidth。我的理解是,如果与空依赖项数组一起使用,useEffect只执行一次(在初始呈现之后),但是在调整屏幕大小时,heightwidth也会被更新,从而导致重新呈现。

EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/74472379

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档