Diferencia entre revisiones de «Fecha Actual y Hora»
De enunpimpam
(Página creada con «Saber la fecha actual y la hora, pasarla por el estado y asignarla. =Fecha Actual= <syntaxhighlight lang="js"> import React, { Component } from 'react'; import { render }…») |
|||
| Línea 15: | Línea 15: | ||
<p> | <p> | ||
{ this.state.currentDateTime } | { this.state.currentDateTime } | ||
| + | </p> | ||
| + | </div> | ||
| + | ); | ||
| + | } | ||
| + | } | ||
| + | render(<App />, document.getElementById('root'));</syntaxhighlight> | ||
| + | =Fecha Actual Y-m-d= | ||
| + | <syntaxhighlight lang="js"> | ||
| + | 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'));</syntaxhighlight> | ||
| + | |||
| + | =Mes Actual= | ||
| + | <syntaxhighlight lang="js"> | ||
| + | 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'));</syntaxhighlight> | ||
| + | |||
| + | =Año Actual= | ||
| + | <syntaxhighlight lang="js"> | ||
| + | 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> | </p> | ||
</div> | </div> | ||
Revisión del 15:13 19 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'));