From 1ae8be5bbd3c0be04fa7b471ca84e3456c0f1e2a Mon Sep 17 00:00:00 2001 From: dan Date: Thu, 15 Sep 2022 04:08:58 +0100 Subject: [PATCH] oops2 --- beta/src/content/apis/react/useCallback.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/beta/src/content/apis/react/useCallback.md b/beta/src/content/apis/react/useCallback.md index 46a1fce0..2675488d 100644 --- a/beta/src/content/apis/react/useCallback.md +++ b/beta/src/content/apis/react/useCallback.md @@ -807,7 +807,7 @@ Make sure you've specified the dependency array as a second argument! If you forget the dependency array, `useCallback` will return a new function every time: ```js {7} -function ProductPage({ product, referrerId }) { +function ProductPage({ productId, referrer }) { const handleSubmit = useCallback((orderDetails) => { post('/product/' + productId + '/buy', { referrer, @@ -820,7 +820,7 @@ function ProductPage({ product, referrerId }) { This is the corrected version passing the dependency array as a second argument: ```js {7} -function ProductPage({ product, referrerId }) { +function ProductPage({ productId, referrer }) { const handleSubmit = useCallback((orderDetails) => { post('/product/' + productId + '/buy', { referrer, @@ -837,7 +837,7 @@ If this doesn't help, then the problem is that at least one of your dependencies // .. }, [productId, referrer]); - console.log([product, referrerId]); + console.log([productId, referrer]); ``` You can then right-click on the arrays from different re-renders in the console and select "Store as a global variable" for both of them. Assuming the first one got saved as `temp1` and the second one got saved as `temp2`, you can then use the browser console to check whether each dependency in both arrays is the same: