//最簡單用法
   useEffect(() => {
     //只有方法體，相當(dāng)于componentDidMount和componentDidUpdate中的代碼
    document.title = count;
  })
  //加返回值用法
  useEffect(() => {
    //添加監(jiān)聽事件，相當(dāng)于componentDidMount和componentDidUpdate中的代碼
    window.addEventListener('resize', onChange, false);
    //返回的函數(shù)用于解綁事件，相當(dāng)于componentWillUnmount中的代碼
    return () => {
      window.removeEventListener('resize', onChange, false)
    }
  })
  //加空數(shù)組參數(shù)用法
  useEffect(() => {
    // 相當(dāng)于 componentDidMount
    window.addEventListener('resize', onChange, false)
    return () => {
      // 相當(dāng)于 componentWillUnmount
      window.removeEventListener('resize', onChange, false)
    }
  }, []);
  //加監(jiān)聽值用法
  useEffect(() => {
   //只有當(dāng)count的值發(fā)生變化，此函數(shù)才會(huì)執(zhí)行
    console.log(`count change: count is ${count}`)
  }, [ count ]);

// 用于記錄 getData 調(diào)用次數(shù)
let count = 0;
function App() {
  const [val, setVal] = useState("");
  function getData() {
    setTimeout(()=>{
      setVal('new data '+count);
      count++;
    }, 500)
  }
  useEffect(()=>{
    getData();
  }, []);
  return (
    <div>{val}</div>
  );}

// 用于記錄 getData 調(diào)用次數(shù)
let count = 0;
function App() {
  const [val, setVal] = useState("");
  function getData() {
    setTimeout(() => {
      setVal("new data " + count);
      count++;
    }, 500);
  }
  return <Child val={val} getData={getData} />;}function Child({val, getData}) {
  useEffect(() => {
    getData();
  }, [getData]);
  return <div>{val}</div>;}

useEffect(() => {
  getData();}, []);

const getData = useCallback(() => {
  setTimeout(() => {
    setVal("new data " + count);
    count++;
  }, 500);}, []);

document.addEventListener('mousemove',handleMouse,true)

onst handleMouse= useCallback(() => {
//xxxx
    console.log("clicking");
  }, []);