Solucionado
Sei que não foi ensinado na aula, mas busquei solução com a propriedade valueAsDate.
A data fica correta no campo da página ao definir o valor do campo com:
var inputData = document.querySelector('#data')
inputData.valueAsDate = new Date()O problema é quando quero resgatar este valor:
console.log('data :', document.querySelector('#data').valueAsDate);para contornar isso eu teria que somar um dia na data recebida?
Boa tarde, Hiago! Como vai?
Em que navegador e versão dele vc está testando esse código? Eu utilizei o código abaixo pra testar o que vc falou de modo a entender melhor a questão e não funcionou.
<input type="text" id="data">
<button id="envia">Envia</button>
<script>
const btnEnvia = document.querySelector('#envia');
const campoData = document.querySelector('#data');
campoData.valueAsDate = new Date();
btnEnvia.addEventListener('click', () => {
console.log(campoData.valueAsDate);
});
</script>Esse código gerou o erro a seguir.
Uncaught DOMException: Failed to set the 'valueAsDate' property on 'HTMLInputElement': This input element does not support Date values.
Qualquer coisa é só falar!
Grande abraço e bons estudos, meu aluno!
Boa tarde Gabriel. Uso o chrome Versão 79.0.3945.117 (Versão oficial) 64 bits.
Acho que o problema aí é sua tag input no html. imagino que ele deve ser do tipo date:
<input type="date" id="data" >Obrigado pela atenção.
Bom, acho que entendi o que está acontecendo. Quando pego a data, ele aplica o fuso horário e muda ela.
O código sempre me retorna a data com três horas de atraso em relação ao que está escrito no campo da página.
retorno : Thu Jan 09 2020 21:00:00 GMT-0300 (Horário Padrão de Brasília)Opa, Hiago! Correto, era isso mesmo!
Com relação ao problema em si, o que ocorre é que a data usada no atributo valueAsDate não utiliza um timezone. Então, ao fazer campoData.valueAsDate = new Date() o que ocorre é que o navegador entende como sendo a hora 0 da data atual. Quando a conversão é feita de forma reversa ( valor do campo para Date ) o timezone é levado em consideração. Como estamos num timezone de -3 GMT, são removidas 3h a partir das 0h da data atual. Fazendo com que o resultado impresso seja do dia anterior.
Exemplo prático
campoData.valueAsDate = new Date(); // 0h de 10/01/2020
console.log(campoData.valueAsDate); // 21h de 09/01/2020Pegou a ideia? Qualquer coisa é só falar!
Grande abraço e bons estudos, meu aluno!
Perfeito Gabriel, muito Obrigado!
Por nada, Hiago! Sempre que precisar de alguma ajuda é só mandar aqui no fórum da Alura!
Grande abraço e bons estudos, meu aluno!