react js clock code example

Example 1: state with react functions

class Example extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      count: 0
    };
  }

  render() {
    return (
      <div>
        <p>You clicked {this.state.count} times</p>
        <button onClick={() => this.setState({ count: this.state.count + 1 })}>
          Click me
        </button>
      </div>
    );
  }
}

Example 2: clock reactjs

import React, { useState } from 'react'

const Clock = ({ theme }) => {
	// For digital clock
	let time = new Date().toLocaleTimeString();
	let [ctime, setCTime] = useState();
	const updateTime = () => {
		time = new Date().toLocaleTimeString();
		setCTime(time);
	}
	setInterval(updateTime, 1000);
	return (
		<>
        <h2> {ctime}.</h2>
		</>);
}
export default Clock;

Example 3: reactjs update state example

{
  hasBeenClicked: false,
  currentTheme: 'blue',
}

Example 4: clock reactjs

import React, { useState } from 'react'

const Clock = () => {
    const [time, setTime] = useState('');
    setTimeout(() => {
        setInterval(() => {
            setTime(new Date().toLocaleTimeString())
        }, 1000)
    })
    return (
        <div>
            <h1>Hello, world!</h1>
            <h2>It is {new Date().toLocaleTimeString()}.</h2>
        </div>);
}
export default Clock;