react-hooks
常用：
useState
const [state, setState] = useState(initialState);在初始状态，state 与传入的第一个参数 initialState 的值相同。
setState 函数用于更新 state。
eg:
import React, {useState} from 'react'
export default function Test() {
const [name, setname] = useState('zli')
return (
<div>
{name} //'zli'
<button onClick={()=>{
setname('zll')//'zll'
}}>changeName</button>
</div>
)
}
</script>useEffect
const [name, setname] = useState('zli')
//副作用处理
useEffect(()=>{
//如果在这里对name做了修改，那么数组中必须指明对应的依赖（即状态）
setname(name.toUpperCase());
return () => {
console.log('在这里组件被销毁')
}
},[name])说明：
（1）第二个参数如果是空数组，那么第一个参数只走一次；
（2）如果 [name] name作为依赖存在；
（3）只要被修改，第一个参数就会走一次；
（4）在这里可以看作是对状态数据的再次加工处理。
useCallback
防止因为组件重新渲染，导致方法再次被创建，起到缓存作用。
const [name, setname] = useState('zli')
const myFn = useCallback(()=>{
console.log(name);
},[name])说明：
（1）只有 name 改变，函数才会重新生成一次；
（2）如果传入空数组，函数首次执行生成，之后不变；
（3）如果不传数组，每次都会生成新的函数。
useMemo
对状态数据进行计算，最终返回一个结果。
const getResult = useMemo(()=>list.map(n=>n**2),[list])useRef
const refContainer = React.useRef(initialValue)useRef 返回一个可变的 ref 对象，其 .current 属性被初始化为传入的参数（initialValue)
特点：
- useRef 是一个只能用于函数组件的方法；
- useRef 是除字符串 ref、函数 ref、createRef 之外的第四种获取 ref 的方法；
- useRef 在渲染周期内永远不会变，因此可以用来引用某些数据；
- 修改 ref.current 不会引发组件重新渲染；
- useRef 在每次重新渲染后都保持不变，而 createRef 每次都会发生变化。
自定义hooks:
（1）必须以 “use” 开头；
（2）当我们想在两个函数之间共享逻辑时，我们会把它提取到第三个函数中；
（3）再解释：将复杂代码封装到函数中。