React Hooks | Get Time on refreshing and Clicking button using useState Hook

 React Hooks | Get Time on refreshing and Clicking button using useState Hook

App.js

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

const App = () => {
  let CurrentTime = new Date().toLocaleTimeString();

  const [btnsetBtn] = useState(CurrentTime);
  const btnClick = () => {
    let currentTime = new Date().toLocaleTimeString();;
    setBtn(currentTime)
  }
  return (
    <>
      <h1>{btn}</h1>
      <button onClick={btnClick}>Click me</button>
    </>
  );
}

export default App;

index.css

*{
  box-sizingborder-box;
  padding0;
  margin0;
  background-color#d2dbdd;
}

div{
  width100%;
  height100vh;
  displayflex;
  flex-directioncolumn;
  justify-contentcenter;
  align-itemscenter;
}

button{
  padding15px 20px;
  background#9b59b6;
  colorwhite;
  border2px solid #ecf0f1;
  text-transformuppercase;
  cursorpointer;
  border-radius20px;
}

Live update Time using Hooks in ReactJs



App.js

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

const App = () => {
  let CurrentTime = new Date().toLocaleTimeString();

  const [btnsetBtn] = useState(CurrentTime);
  
  const btnClick = () => {
    let currentTime = new Date().toLocaleTimeString();;
    setBtn(currentTime)
  }

  setInterval(btnClick,1000);
  return (
    <>
      <h1>{btn}</h1>
      {/* <button onClick={btnClick}>Click me</button> */}
    </>
  );
}

export default App;