Diferencia entre revisiones de «Fecha Actual y Hora»
De enunpimpam
Línea 1: | Línea 1: | ||
+ | [[Categoría:React]] | ||
Saber la fecha actual y la hora, pasarla por el estado y asignarla. | Saber la fecha actual y la hora, pasarla por el estado y asignarla. | ||
=Fecha Actual= | =Fecha Actual= | ||
− | <syntaxhighlight lang=" | + | <syntaxhighlight lang="jsx"> |
import React, { Component } from 'react'; | import React, { Component } from 'react'; | ||
import { render } from 'react-dom'; | import { render } from 'react-dom'; | ||
Línea 22: | Línea 23: | ||
render(<App />, document.getElementById('root'));</syntaxhighlight> | render(<App />, document.getElementById('root'));</syntaxhighlight> | ||
=Fecha Actual Y-m-d= | =Fecha Actual Y-m-d= | ||
− | <syntaxhighlight lang=" | + | <syntaxhighlight lang="jsx"> |
import React, { Component } from 'react'; | import React, { Component } from 'react'; | ||
Línea 47: | Línea 48: | ||
=Mes Actual= | =Mes Actual= | ||
− | <syntaxhighlight lang=" | + | <syntaxhighlight lang="jsx"> |
import React, { Component } from 'react'; | import React, { Component } from 'react'; | ||
import { render } from 'react-dom'; | import { render } from 'react-dom'; | ||
Línea 69: | Línea 70: | ||
=Año Actual= | =Año Actual= | ||
− | <syntaxhighlight lang=" | + | <syntaxhighlight lang="jsx"> |
import React, { Component } from 'react'; | import React, { Component } from 'react'; | ||
import { render } from 'react-dom'; | import { render } from 'react-dom'; | ||
Línea 90: | Línea 91: | ||
render(<App />, document.getElementById('root'));</syntaxhighlight> | render(<App />, document.getElementById('root'));</syntaxhighlight> | ||
− | =Hora Actual=<syntaxhighlight lang=" | + | =Hora Actual=<syntaxhighlight lang="jsx"> |
import React, { Component } from 'react'; | import React, { Component } from 'react'; | ||
import { render } from 'react-dom'; | import { render } from 'react-dom'; |
Revisión actual del 14:51 21 ago 2020
Saber la fecha actual y la hora, pasarla por el estado y asignarla.
Fecha Actual
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'));
Fecha Actual Y-m-d
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'));
Mes Actual
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'));
Año Actual
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'));
=Hora Actual=
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'));