实习小记4.30（useRequest原理）

useRequest是利用useState实现的。 下面这种写法是正确的，只是在没有拿到网络请求结果的时候，传给子组件的值是空，当拿到返回值之后，通过useState改变值会重新渲染页面，再把真正的值传给子组件。

而useRef中的值不会引起页面的重新渲染（只要不使用useState都不能在值变化后重新传给子组件，因为JSX就没有再重新渲染）

import React, {  useRef } from "react";
import { Button } from 'antd'

// 子组件
const ChildComponent = ({ data }) => {
  return (
    <div>
        <p>{data}</p>
    </div>
  );
};

// 父组件
const ParentComponent = () => {
 const data = useRef(3)
 const handleClick = () => {
   data.current = 1
 }
  return (
    <div>
      <h1>父组件</h1>
      <Button onClick={handleClick}>+1</Button>
      <ChildComponent data={data.current} />
    </div>
  );
};

export default ParentComponent;