In this article, we will see how to get the current date and time in react js. You can get the current date and time using react js. We will use the date() function to get the current timestamp. Also, you can get the current month and current year in react js. In react js date function return current date yyyy-mm-dd.
So, let's see how to get the current date in react js, react js get the current date and time.
In this example, we will get the day name with date and time and also get the timezone.
import React, { Component } from 'react';
import { render } from 'react-dom';
class App extends Component {
constructor() {
this.state = {
currentDateTime: Date().toLocaleString()
}
}
render() {
return (
<div>
<p>
{ this.state.currentDateTime }
</p>
</div>
);
}
}
render(<App />, document.getElementById('root'));
Output:
In this example, we will get the Y-m-d format date.
import React, { Component } from 'react';
import { render } from 'react-dom';
class App extends Component {
constructor() {
var today = new Date(),
date = today.getFullYear() + '-' + (today.getMonth() + 1) + '-' + today.getDate();
this.state = {
currentDate: date
}
}
render() {
return (
<div>
<p>
{ this.state.currentDate }
</p>
</div>
);
}
}
render(<App />, document.getElementById('root'));
Output:
In this example, we will get the current month using the getMonth() function.
import React, { Component } from 'react';
import { render } from 'react-dom';
class App extends Component {
constructor() {
this.state = {
currentMonth: new Date().getMonth()
}
}
render() {
return (
<div>
<p>
{ this.state.currentMonth }
</p>
</div>
);
}
}
render(<App />, document.getElementById('root'));
Output:
In this example, we will get the current year using the getFullYear() function.
import React, { Component } from 'react';
import { render } from 'react-dom';
class App extends Component {
constructor() {
this.state = {
currentYear: new Date().getFullYear()
}
}
render() {
return (
<div>
<p>
{ this.state.currentYear }
</p>
</div>
);
}
}
render(<App />, document.getElementById('root'));
Output:
In this example, we will currently time using the javascript function.
import React, { Component } from 'react';
import { render } from 'react-dom';
class App extends Component {
constructor() {
var today = new Date(),
time = today.getHours() + ':' + today.getMinutes() + ':' + today.getSeconds();
this.state = {
currentTime: time
}
}
render() {
return (
<div>
<p>
{ this.state.currentTime }
</p>
</div>
);
}
}
render(<App />, document.getElementById('root'));
Output:
You might also like:
Hello Freinds, In this tutorial we will see laravel 8 multiple database connections. Today I will give you step by st...
Apr-19-2021
In this article, we will see laravel 9 many to many polymorphic relationship. many to many polymorphic relationship more...
Apr-06-2022
In this small post i will so you jquery search filter example. here we will see how to search data using jquery filter....
Aug-25-2021
In this article, we will see how to validate the ajax form in laravel 10. Here we will learn about the laravel 10 a...
Mar-24-2023