关于React的State(状态) Hook

此示例渲染一个计数器。单击该按钮时，它会递增值：

import { useState } from 'react';

function Example() {
  // 声明一个新的状态变量，我们将其称为 "count"
  //useState首次执行时会将默认值传给count,当再次执行时会则会直接取上次 setCount (如果有调用) 赋过的值
  const [count, setCount] = useState(0);

  return (
    <div>
      <p>You clicked {count} times</p>
      <button onClick={() => setCount(count + 1)}>
        Click me
      </button>
    </div>
  );
}

useState 应该理解为和普通的 javascript 函数一样，而不是 React 的什么黑魔法。函数组件更新的时候，useState 会重新执行，对应的，也会重新声明 [count, setCount] 这一组常量。只不过 React 对这个函数做了一些特殊处理。比如：首次执行时，会将 useState 的参数初始化给 count，而以后再次执行时，则会直接取上次 setCount (如果有调用) 赋过的值（React 通过某种方式保存起来的）。

Effect Hook

//第一次执行给data传入一个空数组
const [data, setData] = useState([]);
//页面每次组件加载的时候都会执行useEffect，数据发生变化的时候也会执行一次
    useEffect(() => {
      axios.get('/data.json').then( res => {
         const resp = res.data
         if( resp.code === 0 ) {
         //请求成功把最新的值赋给setData,从而实现数据更新
            setdata(resp.data)
         }
      })
    })