Tentando encapsular a lógica

Nesta aula, será implementada uma espécie de relógio, em que o estado será a própria hora, que muda de forma constante.

Criando o relógio

Acompanhando a aula, crie o relógio observando todas as alterações feitas. Ao final, o código produzido deverá estar como se observa abaixo:

import React from 'react';
import ReactDOM from 'react-dom';

function Clock(props) {
  const element = (
    <div><h1>Hora: {props.date.toLocaleTimeString()} </h1></div>
  )
  return element;
}

function tick() {
  ReactDOM.render(
    <Clock date={new Date()} />,
    document.getElementById('root')
  );
}

setInterval(tick, 1000);

Essa maneira funciona, porém, ainda não é a maneira correta de se implementar o código. Na próxima aula, será apresentada a maneira certa de fazer isso.