Skip to content

Instantly share code, notes, and snippets.

@simbathesailor
Created December 25, 2019 15:50
Show Gist options
  • Save simbathesailor/d3f268668bb8eb3ba920d050cd51cd78 to your computer and use it in GitHub Desktop.
Save simbathesailor/d3f268668bb8eb3ba920d050cd51cd78 to your computer and use it in GitHub Desktop.
blog9.md
function useFunctionHook(fn, ref) {
  
  React.useEffect(
    () => {
            fn();
    },
    [fn]
  );
  React.useEffect(() => {
    // some trivial update happening to 
    if(ref.current) {
        ref.current.style.backgroundColor = "hotpink"
    }
    
  }, [ref])
}


function fnCallback() {
    console.log("Hi bro");
}

function App() {
  const ref = React.useRef(null)
  
  const [countInParent, setCountInParent] = React.useState(0);
  
  const fn = React.useCallback(fnCallback, [])

  useFunctionHook(fn, ref);

  return (
    <div ref={ref}>
      {countInParent}
      <button onClick={() => setCountInParent(c => c + 1)}>
        Increment Parent's count
      </button>
    </div>
  );
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment