当函数作为依赖于useMemo依赖数组时使用useMemo或useCallback更好

Question

我有一段用useMemo包装的代码，它使用一个函数作为一个依赖项返回一些数据，在本例中使用useMemo是否值得，因为我们返回数据，还是更好地返回useCallback？

示例：

 // useMemo vs useCallback ?
 const getConfigs = useCallback((configs)=> {
   return configs.filter(...some filtering logic)
 }, [])

const getConfigs = useMemo(()=> {
   return configs.filter(...some filtering logic)
 }, [props.configs])

 const someMemoData = useMemo(()=>{
   return {
     names: props.names,
     configs: getConfigs(props.configs) or getConfigs in case useMemo
  }
 }, [props.names, getConfigs, props.configs])

Answer 1

如果返回数据，请使用useMemo

如果返回函数，请使用useCallback

他们都接受相同的参数。他们的第一个论点是回调。唯一的区别是：

useMemo(cb) returns cb()
useCallback(cb) returns cb

useCallback(() => {})与useMemo(() => () => {})相同

您的getConfigs返回一个函数，所以最好对它使用useCallback。当someMemoData返回对象时，使用useMemo