1
resposta

[RESOVIDO (faltava a extensão do arquivo ".js" no meu import)]

Os videos não aparecem dinamicamente na minha página O node está rodando, o código parece estar identico

Insira aqui a descrição dessa imagem para ajudar na acessibilidade

Insira aqui a descrição dessa imagem para ajudar na acessibilidade

Insira aqui a descrição dessa imagem para ajudar na acessibilidade

conectaApi.js ->

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

export const conectaApi = {
    listaVideos
}

mostrarVideos.js ->

import { conectaApi } from "./conectaApi";

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

function constroiCard(titulo, descricao, url, imagem) {
    const video = document.createElement("li");
    video.className = "videos__item0";
    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(params) {
    const listaApi = await conectaApi.listaVideos();
    listaApi.forEach(elemento => lista.appendChild(constroiCard(elemento.titulo, elemento.descricao, elemento.url, elemento.imagem)));


}
listaVideos();

1 resposta

Olá, Henry.

Tudo bem?

Que bom que você conseguiu resolver! Muito obrigado por avisar que conseguiu e principalmente por mostrar como você fez.

Qualquer dúvida manda aqui. Valeu.