Hook and useState in React

 


import './App.css'; 
import React ,{useState} from "react";



function App(){
//setInterval(updateTime,1000) //1000 is sec
//this is a function by javascript

  const now = new Date().toLocaleTimeString();
  const [time, setTime] = useState(now); // first wla variable and 2nd wala function
ever time useState me kuch hona chiya phela

function updateTime(){
  const newTime = new Date().toLocaleTimeString(); //variable 
  setTime(newTime);
}

return(
  <div className = "container">
  <h1>{time}</h1>
  <button onClick={updateTime}>GetTime</button>
</div>
)

}
    
   

export default App;

/////////////////////////////////////////////////////////////////////////////////////

Step 1 :- we have to Import useSate from react

step 2 ;- creat function and under which create another function

create aka variable const and [] first wla hoga ake variable and 2nd wala mae function
hoga






















Comments

Post a Comment

Popular posts from this blog

Props and pass data from object list

 obj list const Brand = [ { name : "biplav" , song : "chalu haa" , }, { name : "emiway" , song : "malum haa na" , }, { name : "Rafter" , song : "Swag mara desi" , }, { name : "ikka" , song : "half window" , } ] export default Brand ; import react from "react" ; import Brand from "./Reel" ; console . log (Brand); function M1 () { return ( < div > < h1 > { Brand[ 0 ]. name } </ h1 > < h1 > { Brand[ 0 ]. song } </ h1 > < h1 > { Brand[ 1 ]. name } </ h1 > </ div > ); } export default M1 ; import "./styles.css" ; import M1 from "./Chal" export default function App () { function P1 (props){ return ( < div > < h1 > { props . car } </ h1 > < h1 > { props . car } </ h1 ...
Read more

Changing complex state in React (react forms)

  import React , { useState } from "react" ; function Ap (){ const [ Fname , Setname ] = useState ( "" ); const [ Lname , Stname ] = useState ( "" ); function update (event){ Setname ( event . target . value ); } function updateLname (event){ Stname ( event . target . value ); } return ( <> < h1 >Hello { Fname } { Lname } </ h1 > < input type = "text" name = "Fname" onChange ={update} placeholder = "First Name" value = {Fname} /> < input type = "text" name = "Lname" onChange ={updateLname} placeholder = "Last Name" value = {Lname} /> < button >Submit</ button > </> ) } export default Ap ; /////////////////////////////////////////////////////////////////////// Right way or after destructing import React , { useState } from "react" ; function Ap (){ const [...
Read more

filer method()

 let a = [12,3,4,5,5]; let no = a.filter(function(num){   return num>10; }) console.log(no); it is a filter function  The filter() method creates an array filled with all array elements that pass a test (provided as a function). Note:  filter() does not execute the function for array elements without values. Note:  filter() does not change the original array.
Read more