React - useState Multiple Condition using Ternary Operator

App.jsx

import { useState } from "react"

const App = () => {
  const [counter, setCounter] = useState(0);
  const handleClick = () => {
    setCounter(counter + 1);
  }
  return(
    <>
      <h1>useState Multiple Condition using Ternary Operator</h1>
      {
        counter == 0 ? <p>Condition 1</p>
        : counter == 1 ? <p>Condition 2</p>
        : counter == 2 ? <p>Condition 3</p>
        : <p>Out of Range</p>
      }
      <button onClick={handleClick} disabled={counter > 2}>Click Here</button>
    </>
  )
}
export default App