每次将 function 传递给子组件时都需要 useCallback 吗？

Question

我试图更好地了解在将函数传递给子组件时何时何地需要 useCallback。 我在我的父组件中声明了一个 function ，它完全重定向到不同的页面。 触发按钮单击

const handleCheckForGuestCheckoutRedirect {
    handleGTMCheckout({ step: '1' })

    if (customer) {
      router.push(paths.CHECKOUT_DELIVERY)
    } else {
      router.push(paths.CHECKOUT_LOGIN)
    }
}

我将它传递给一个子组件，该组件也呈现相同的按钮

<CartSummary handleCheckForGuestCheckoutRedirect={handleCheckForGuestCheckoutRedirect}/>

触发 onClick

 <Button
   onClick={handleCheckForGuestCheckoutRedirect}
   variant="solid"
   size="xl"
   width="100%"
   fontWeight="extrabold"
   fontSize={{ base: 'mobile.body', md: 'desktop.body' }}
 />

因为这个 function 在触发时只是一个重定向。 这里需要useCallback吗？ 如果是这样，为什么？

Answer 1

不，事实上它很少需要并且应该避免，除非它确定你需要它（你会知道什么时候需要它）。

https://kentcdodds.com/blog/usememo-and-usecallback