Estoy tratando de obtener datos de mi API y ponerlos en la entrada de 'opción'. Pero todo lo que obtengo es [objeto Objeto]. Y me gustaría obtener los días de la semana.
const daysOptions = document.querySelector("#days"); const getData = async (url) => { try { const res = await fetch(url); const data = await res.json(); if (data.length > 0) { return data; } } catch (err) { alert(err); } }; const createOptions = async () => { const dataDays = await getData("http://localhost:8080/v1/days/getdays"); console.log(dataDays); dataDays.forEach((day) => { const selectOption = document.createElement("option"); selectOption.value = day; // selectOption.id = id; selectOption.textContent = day; daysOptions.append(selectOption); }); }; createOptions();Lo que estoy buscando es:
0: {id: 1, day: 'Monday'} 1: {id: 2, day: 'Tuesday'} 2: {id: 3, day: 'Wednesday'} 3: {id: 4, day: 'Thursday'} 4: {id: 5, day: 'Friday'}Después de obtener cuando está haciendo un bucle, debe codificar como este a continuación
dataDays.forEach((item) => { const selectOption = document.createElement("option"); selectOption.value = item.day; // selectOption.id = id; selectOption.textContent = item.day; daysOptions.append(selectOption); });Aquí, usando el elemento, accedo a cada objeto de la lista recuperada, y item.day obtiene el valor del día.
Si esto resuelve su problema, hágamelo saber respondiendo o votando a favor. Gracias
Si está utilizando reaccionar js, puede usar este código.
const Days = () => { const days = [ { id: 1, day: "Monday" }, { id: 2, day: "Tuesday" }, { id: 3, day: "Wednesday" }, { id: 4, day: "Thursday" }, { id: 5, day: "Friday" }, { id: 5, day: "Saturday" }, { id: 5, day: "Sunday" }, ]; return ( <div> <select name="days" id=""> {days.map((day) => ( <option key={day.id} value={day.day}> {day.day} </option> ))} </select> </div> ); }; ReactDOM.render( <div> DEMO <Days /> </div>, document.getElementById("rd") ); <script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script> <div id="rd" />