```javascript const SomeComponent=({onChange, id})=>{ const handleClick= useCallback(()=>{ onChange(id); },[]); return handleClick()}>Click me! ; }; ``` What are the issues with this code?

There are some dependencies missing in the useCallback, we can have a desynchronization with the parent component

There are missing parentheses around ` ... `, the code is not valid JSX

There are some dependencies missing in the useCallback, we can have a desynchronization with the parent component

Home>IT Tests>Questions>Find the issue with this React code:

Question from the React ⚛️ test

Find the issue with this React code:

Medium

const SomeComponent=({onChange, id})=>{
    const handleClick= useCallback(()=>{
        onChange(id);
  },[]);
 return <button onClick={()=>handleClick()}>Click me!</button>;
};

What are the issues with this code?

Author: Clément DEVOSStatus: PublishedQuestion passed 4655 times

Edit

Community Evaluations

Auteur anonyme

30/04/2024

Why is "You must absolutely encapsulate the onClick handler in a useCallback, otherwise performance will be impacted" the wrong answer? the button with onClick={()=>handleClick()} will rerender whenever the parent component does, even if handleClick is wrapped in useCallback, we need to write this way onClick={handleClick} to avoid extra rerenders and a negative impact for performance

Auteur anonyme

29/05/2024

I don t know too

Auteur anonyme

15/08/2024

useCallback is required only when performance is impacted, as this function itself adds extra work for each render. if onClick action does not impact performance, it should not be used.