Hola, estoy tratando de obtener un archivo JSON local. Usé localhost para esto, pero el problema que tengo es cuando lo busco usando:

const endpoint = "http://127.0.0.1:5500/appendixA.json"

 const fetchedItems = fetch(endpoint) .then(res => res.json()) .then(result => result.appendix_a) .catch(e => console.log("error: ", e))

o usando async await

 const fetchFunc = async () => { let response = await fetch(endpoint); let jsonResponse = await response.json() return jsonResponse.appendix_a; }

Entonces, cuando console.log cualquiera de ellos console.log(fetchedItems) console.log(fetchFunc()) No obtengo el resultado como una matriz variable, es decir, [ //resultados], sino que obtengo solo una [Promesa]

Aquí hay una muestra del archivo JSON

 { "appendix_a": [ { "id": 1, "stakeholder": "Commercial Director", "user_story": "As a user I need to be able to insert my name into the form" }, { "id": 2, "stakeholder": "Commercial Director", "user_story": "As a user I need to be able to insert my email into the form" } ] }

¿Por qué está sucediendo esto, ya que hice res.json() en la inicial? Luego, llamé y await res.json() dentro de la función asíncrona

Por favor aclarame eso.

Como planeo insertar los datos de búsqueda en un elemento ul como este, que obviamente no funcionará debido a la Promesa

 const ul = document.querySelector('ul'); let li = document.createElement('li'); fetchedItems.map(pa => { li.innerHTML = ` <span>${pa.id}</span> <p>${pa.stakeholder}></p> <p>${pa.user_story}</p> ` return ul.appendChild(li); });