counter-notifier-usecallback.js

import React, { useState, useEffect, useCallback } from "react";

const Counter = ({ notify }) => {
  const [value, setValue] = useState(0);

  useEffect(() => {
    notify(value);
  }, [value, notify]);

  return <button onClick={() => setValue(value + 1)}>Increment</button>;
};

const CounterNotifier = ({ url }) => {
  const handleNotify = useCallback(value => api.send(url, value), [url]);

  return (
    <div>
      <p>{`Notifing even values to ${url}`}</p>
      <Counter notify={handleNotify} />
    </div>
  );
};