当前位置: 首页 > 面试题库 >

react-hooks:跳过第一次在useEffect中运行

公孙嘉禧
2023-03-14
问题内容

我该如何跳过第一次遇到问题useEffect

useEffect(() => {
    const first = // ???
  if (first) {
    // skip
  } else {
    // run main code
  }
}, [id]);

问题答案:

useRef挂钩可用于存储任何可变值,因此您可以存储一个布尔值,指示是否是第一次运行效果。

const { useState, useRef, useEffect } = React;



function MyComponent() {

  const [count, setCount] = useState(0);



  const isFirstRun = useRef(true);

  useEffect (() => {

    if (isFirstRun.current) {

      isFirstRun.current = false;

      return;

    }



    console.log("Effect was run");

  });



  return (

    <div>

      <p>Clicked {count} times</p>

      <button

        onClick={() => {

          setCount(count + 1);

        }}

      >

        Click Me

      </button>

    </div>

  );

}



ReactDOM.render(

  <MyComponent/>,

  document.getElementById("app")

);


<script src="https://unpkg.com/react@16.7.0-alpha.0/umd/react.development.js"></script>

<script src="https://unpkg.com/react-dom@16.7.0-alpha.0/umd/react-dom.development.js"></script>



<div id="app"></div>


 类似资料:
  • 问题内容: 有没有一种优雅的方法可以跳过Java5 foreach循环中的第一次迭代? 伪代码示例: 问题答案: 我不会称其为优雅,但可能比使用“第一个”布尔值更好: 除此之外,可能没有优雅的方法。

  • 问题内容: 假设我有3个输入:rate,sendAmount和receiveAmount。我把那3个输入放在useEffect diffing params上。规则是: 如果sendAmount更改,我计算 如果receiveAmount改变了,我计算 如果费率发生变化,我计算时间或计算时间 这是codesandbox https://codesandbox.io/s/pkl6vn7x6j来演示此

  • 让我解释一下这段代码的结果,以便轻松地询问我的问题。 如果我想让这个组件只在卸载时保持日志“清理”,我只需要将的第二个参数更改为。 但是,如果将更改为,不再实现名称输入的。 我想做的是,使组件只支持名称输入和。(仅在卸载组件时,日志记录“已清除”)

  • 问题内容: 我正在尝试将事件发射器与React 和一起使用,但是它始终获取初始状态而不是更新状态。如果我直接调用事件处理程序(即使使用),也可以使用。 如果我将值传递给第二个参数,它将使其起作用,但是,每当值更改时(这是击键触发的),这都会导致事件发射器重新订阅。 我究竟做错了什么?我试过,,,和,并不能得到任何工作。 这是复制品: 这是具有相同代码的代码沙箱: https://codesandb

  • 问题内容: 我正在使用以下内容读取文件的各行, 现在,我想跳过读取文件的第一行,并且不想使用计数器行来保持行数。 这该怎么做? 问题答案: 你可以试试这个

  • 问题内容: 编辑:感谢你们的快速反应-我最终切换到mysql_fetch_assoc()并使用do … while,我很高兴。 我正在使用相同的过程来创建和填充表-一切正常,除了 在每个表中跳过第一行 。由于我似乎无法查明问题,可以用另一双眼睛。提前致谢。 问题答案: 您正在调用mysql_fetch_array两次…循环前一次,循环时一次。 如果您需要种子行来构建标题行,则最好在此处使用do .