React hook useEffect 永远无限循环地持续运行

React是一个流行的JavaScript库，用于构建用户界面。它使用组件的概念，将UI拆分为可重用的部分，并通过数据的变化来更新界面。为了更好地管理组件状态和副作用，React引入了Hooks。其中一个最常用的Hook是useEffect，它允许我们在函数组件中执行副作用操作。

javascript
import React, { useState, useEffect } from 'react';
const Counter = () => {
  const [count, setCount] = useState(0);
  useEffect(() => {
    if (count % 2 !== 0) {
      console.log('Count is odd');
    }
  }, [count]);
  const increment = () => {
    setCount(count + 1);
  };
  return (
    
      
Count: {count}
      Increment
    
  );
};
export default Counter;

javascript
const increment = () => {
  setCount(prevCount => prevCount + 1);
};

javascript
import React, { useState, useEffect, useRef } from 'react';
const Counter = () => {
  const [count, setCount] = useState(0);
  const countRef = useRef(count);
  useEffect(() => {
    countRef.current = count;
  }, [count]);
  useEffect(() => {
    if (countRef.current % 2 !== 0) {
      console.log('Count is odd');
    }
  }, [countRef]);
  const increment = () => {
    setCount(count + 1);
  };
  return (
    
      
Count: {count}
      Increment
    
  );
};
export default Counter;