hooks使用之useMemo

1. vue ---> 计算属性 useMemo 类似
2. useCallback 就是 useMemo实现的

用来做缓存的 功能上和 useCallback 完全一致 只不过他除了可以缓存函数以外 任何东西都可以缓存

useCallback: 第一个参数也是一个函数, 但是他的这个函数不会被react执行, 而是直接进入缓存

useMemo:

1. 第一个参数是一个函数, 这个函数会被react直接执行, 任何将其返回值进行缓存
2. 第二个参数是依赖项, 当依赖项发生变化时, react会重新执行对应的第一个参数, 然后拿到新的返回值, 再次缓存

function StudentList () {
    const [studentList, setStudentList] = useState([])
    const {loading, executeRequest} = useRequestLoadingDispatcher()
    

    const fetchResponse = useCallback(async() => {
        executeRequest(async() => {
            const res = await getStudentList()
            setStudentList(res.data)
        })
    }, [executeRequest])

    useEffect(() => {
        executeRequest(fetchResponse)
    },[])

    return (
        <div>
            {loading ? (<div>正在加载中...</div>) : studentList.map(item => (<StudentItem {...item} key={item.name}/>))}
        </div>
    )
}