【React深入】从Mixin到HOC再到Hook

useEffect方法接收传入两个参数：

•  1.回调函数：在第组件一次render和之后的每次update后运行，React保证在DOM已经更新完成之后才会运行回调。
•  2.状态依赖(数组)：当配置了状态依赖项后，只有检测到配置的状态变化时，才会调用回调函数。 

useEffect(() => {  
   // 只要组件render后就会执行  
 });  
 useEffect(() => {  
   // 只有count改变时才会执行  
 },[count]); 

回调返回值

useEffect的第一个参数可以返回一个函数，当页面渲染了下一次更新的结果后，执行下一次useEffect之前，会调用这个函数。这个函数常常用来对上一次调用useEffect进行清理。

export default function HookTest() {  
  const [count, setCount] = useState(0);  
  useEffect(() => {  
    console.log('执行...', count);  
    return () => {  
      console.log('清理...', count);  
    }  
  }, [count]);  
  return (  
    <div>  
      <p>You clicked {count} times</p>  
      <button onClick={() => { setCount(count + 1); setNumber(number + 1); }}>  
        Click me  
        </button>  
    </div>  
  );  
} 

执行上面的代码，并点击几次按钮，会得到下面的结果：

（编辑：晋中站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!