DEV Community

Discussion on: React Hooks: UseEffect, UseCallback, UseMemo

View post
Collapse
 
seanmclem profile image
Seanmclem •

For useCallback, would we benefit from passing the product.id into the function? instead of accessing the variable from outside the function

Collapse
 
jacobmparis profile image
Jacob Paris •

Not really. You could do that:

const removeFromCart = (id) => dispatch(removeItem(id));

return (
    <Button onClick={() => removeFromCart(product.id)}>Delete</Button>
);

but then we might as well go all the way

return (
    <Button onClick={() => dispatch(removeItem(product.id))}>Delete</Button>
);

And then it's apparent we're at the same position of accessing the ID from outside the function call. I like to define them outside of the JSX, and then when we add the useCallback function it stays nice and clean and separated

Collapse
 
seanmclem profile image
Seanmclem •

But it's pure

Thread Thread
 
jacobmparis profile image
Jacob Paris •

PURE

return (
    <Button
        productId={product.id}
        onClick={e => (
            dispatch(removeItem(e.target.getAttribute("productId")))
        )}
    >Delete</Button>
);