基本概念:

用于在组件中缓存计算结果,以优化性能。它可以帮助你避免在每次渲染时重新计算一些昂贵的操作或函数结果。useMemo 会记住依赖项数组中指定的值,只要这些值没有变化,它就会返回上次计算的结果,而不是重新计算。

使用场景:

  1. 优化性能:当你有一个计算开销大的操作或者函数,并且该操作依赖于某些状态或属性时,useMemo 可以防止在每次渲染时都重新计算这个操作,从而提升性能。

  2. 避免不必要的渲染:useMemo 可以用来缓存某些值,以便避免在渲染过程中创建新的对象或数组,这有助于避免子组件因引用变化而重新渲染。

  3. 传递稳定的引用:当你将对象或函数作为 prop 传递给子组件时,useMemo 可以确保引用在依赖项未变化时保持稳定,从而防止子组件的不必要更新。

基本用法:

const cachedValue = useMemo(calculateValue, dependencies)

参数:

返回值:

缓存的值:useMemo 返回 create 函数的计算结果。这个值会被缓存,并在依赖项未变化时复用。

注意事项: