<div id="root"></div>

function App() {
  const [counter, setCounter] = React.useState(0);
  
  function clickHandler() {
    setCounter(counter+1)
    setCounter(counter+10)
    console.log(counter)
  }
  
    function updateHandler() {
    setCounter((prev)=> prev+1)
    setCounter((prev)=> prev+10)
    console.log(counter)
  }
  
  return (
    <div>
      <div>Counter: {counter}</div>
      <div>
        <button onClick={clickHandler}>Batch</button>
      </div>
      <div>
        <button onClick={updateHandler}>WithFunction</button>
      </div>
      <div>
        <button onClick={()=>setCounter(0)}>clear</button>
      </div>
    </div>
  );
}

const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(<App />);