Eu clico em enviar e não acontece nada o codigo está linkado no HTML corretamente não estou conseguindo identificar o erro
O erro no console aparece: criaVideo.js:7 Uncaught (in promise) TypeError: Cannot read properties of null (reading 'value') at criaVideo (criaVideo.js:7:58) at HTMLFormElement. (criaVideo.js:17:49) criaVideo @ criaVideo.js:7 (anônimo) @ criaVideo.js:17
CriaVideo.js ↓ ↓ ↓
import { conectaApi } from "./conectaApi.js"
const formulario = document.querySelector("[data-formulario]")
async function criaVideo(evento) {
evento.preventDefault()
const imagem = document.querySelector("[data-image]").value
const url = document.querySelector("[data-url]").value
const titulo = document.querySelector("[data-titulo]").value
const descricao = Math.floor(Math.random() * 10).toString()
await conectaApi.criaVideo(titulo, descricao, url, imagem)
window.location.href = "../pages/evio-concluido.html"
}
formulario.addEventListener("submit", evento => criaVideo(evento))
ConectaApi ↓ ↓ ↓
async function listaVideos(){
const conexao = await fetch("http://localhost:3000/videos")
const conexaoConvertida = await conexao.json()
return conexaoConvertida;
}
async function criaVideo(titulo,descricao,url,imagem){
const conexao = await fetch("http://localhost:3000/videos", {
method: "POST",
headers:{
"Cotent-type": "application/json"
},
body: JSON.stringfy({
titulo: titulo,
descricao: `${descricao} mil vizualizações`,
url: url,
imagem:imagem
})
})
const conexaoConvertida = await conexao.json()
return conexaoConvertida
}
export const conectaApi = {
listaVideos,
criaVideo
}