Requisições em Fetch API

Front-end
#1

Bom dia Devs, estou tentando entender o conceito para pegar as informações do servidor via FETCH API, já entendi como funciona e o seu conceito de promisse, porém quando disparo o Submit no formulário quero que imprima os dados de tal servidor no corpo do meu HTML e não estou entendendo como faço isso, alguém poderia me ajudar?

Segue eventual código:

"

<form action="" id="form">
    <input type="text" id="nome">
    <input type="text" id="sexo">
    <input type="submit" value="Enviar">
</form>

<script>
   let form = document.getElementById('form')
   let name = document.getElementById('nome')
   let sexo = document.getElementById('sexo')

   form.addEventListener('submit', function(event){
     event.preventDefault()

    let dados ={
       nome: name.value,
       sexo: sexo.value
    }
    console.log(dados)
     fetch('https://reqres.in/api/users',{
         method: 'post',
         body: JSON.stringify(dados)
     })

     .then(function(response){
         response.json()
     })
     .then(function(data){
         console.log(data)
     })
   })
</script>
"
#2

Aparentemente o código está certo. Dá algum erro?

#4

ta correto, retorna status 201 como era esperado.

Ao invés de erro eu queria tirar uma dúvida, queria saber como eu imprimo as informações dessa URL para minha página, queria entender melhor essa outra parte porque enviar as informações eu consigo.

#5

Pelo que vi, vc está usando um serviço REST FAKE para realizar os testes. Você deve ler na API desse serviço, como usar (qual URL, http method, parâmetros, etc.). Pelo que reparei, vc está passando os parâmetros nome e sexo, mas no site, diz que tem que ser email e password. Verifique isso.

1 curtida
#6

Blz Lucas, vou dar uma verificada.
Obg.

#7

Cria um div com o id resultado. Recupera ela pelo JS, e no then que voce ja esta com os response. voce faz

    resultado.innerHTML = <table><!--  dados do seu response --></table>
#8

Pessoal boa tarde alguém pode me ajudar como eu faço uma listagem dos dados no front end usando o fetch tenho uma api pronta mas não consigo consumir no front.

#9

usa o axios, fim de seus problemas