Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

[Dúvida] Uncaught ReferenceError: listaVideos is not defined

No site da AluraPlay só aparecem os sites que são fixos no html, os vídeos do db.json não estão linkados na api por algum motivo.

No HTML está assim:

 <script src="./js/mostrarVideos.js" type="module"></script>

O mostraVideos.js está assim:

import { conectaApi } from "./conectaApi.js";

const lista = document.querySelector("[data-lista");

function constroiCard(titulo, descricao, url, imagem){
    const video = document.createElement("li");
    video.className = "videos__item";
    video.innerHTML = `
    <iframe width="100%" height="72%" src="${url}"
    title="${titulo}" frameborder="0"
    allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
    allowfullscreen></iframe>
    <div class="descricao-video">
        <img src="${imagem}" alt="logo canal alura">
        <h3>${titulo}</h3>
        <p>${descricao}</p>
    </div>`

    return video;
}

async function listaVideos(){
    const listaApi = await conectaApi.listaVideos();
    listaApi.forEach(elemento => lista.appendChild(
    constroiCard(elemento.titulo, elemento.descricao, elemento.url, elemento.imagem)))
}

listaVideos();

E o conectaApi.js está assim:

async function listaVideos(){
    const conexao = await fetch("https://localhost:3000/videos");
    const conexaoConvertida = await conexao.json();

    return conexaoConvertida;
}

export const conectaApi = {
    listaVideos
}
2 respostas
solução!

... a

const conexao = await fetch("https://localhost:3000/videos");

que estava errada, coloquei um s no http://

import { conectaApi } from "./conectaApi.js";

const lista = document.querySelector("[data-lista");

no código falta um colchete para fechar , por isso ele nao está reconhecendo como lista