DEV Community

Ranjith srt
Ranjith srt

Posted on

usestateHook

import { useState } from "react";

const counter = () => {

//! usestateHook

// var fun state () ulla enna vale kooduthalum defalut value vaa varku set pannum
const [count, setcount] = useState(0); // 1,"str",[],{key:value}

const handleincrement = () => {
setcount(count + 1);
};

const handledecrement = () => {
setcount(count - 1);
};

const handledReset = () => {
setcount(0);
};

return (


Counter :{count}

  <button
    // onClick={() => {
    //   setcount(count + 1);
    // }}

    // onClick={() => {
    //   setcount((prev) => {
    //     return prev + 1;
    //   });
    // }}

    onClick={handleincrement}
  >
    Increment
  </button>

  <button
    // onClick={() => {
    //   setcount(count - 1);
    // }}

    //   onClick={() => {
    //     setcount((prev)=>{
    //         return(prev-1)
    //     });
    //   }}

    onClick={handledecrement}
  >
    Decrement
  </button>
  <button
    // onClick={() => {
    //   setcount(0);
    // }}

    //    onClick={() => {
    //     setcount((prev)=>{
    //         return(0)
    //     });
    //   }}
    onClick={handledReset}
  >
    Reset all
  </button>

  {/* ! object
  <h1>counter : {count.id}</h1>
  <h1>counter : {count.name}</h1> 
  */}
</div>

);
};

export default counter;

Top comments (0)