How to Increment/Decrement a value in React/NextJS

0 min read 62 words

Use the following code block to get started:

function GetCount() {
  const [count, setCount] = useState(1);

  const incrementCounter = () => {
    setCount(count+1)
  }
  const decrementCounter = () => {
    if (count>1) setCount(count-1)
  }

  return <div className="_counterWrapper">
    <span className="_dec" onClick={() => decrementCounter()}>-</span>
    <span className="_val">{count}</span>
    <span className="_inc" onClick={() => incrementCounter()}>+</span>
  </div>
}

Then in your HTML code, add it like this:

<GetCount />
Andrew
Andrew

Andrew is a visionary software engineer and DevOps expert with a proven track record of delivering cutting-edge solutions that drive innovation at Ataiva.com. As a leader on numerous high-profile projects, Andrew brings his exceptional technical expertise and collaborative leadership skills to the table, fostering a culture of agility and excellence within the team. With a passion for architecting scalable systems, automating workflows, and empowering teams, Andrew is a sought-after authority in the field of software development and DevOps.

Tags