MENU


Memoizing a Value

Below, clicking the left button won't change the numbers but clicking the right button will. Rather unlike the case for useCallback() which always runs the callback when called, the callback passed to useMemo is not executed at all if the dependencies have not changed.
RESETRUNFULL
function Example(){
   const [a,setA] = React.useState(0);
   const [b,setB] = React.useState(0);
   const [c,setC] = React.useState(0);
   const m = React.useMemo(
      () => {
         console.log(a,b,c);
        return (a+b+c);
     }, [b,c]
   )
   return (<React.Fragment>
                 <button onClick={()=>setA(a+1)}>{m}</button>
                 <button onClick={()=>setB(b+1)}>{b}</button>
              </React.Fragment>);}ReactDOM.render(<Example/>,document.querySelector("div"));