Quiero usar await para guardar la respuesta a una variable. Necesito almacenar esa respuesta en una variable y usarla en el siguiente flujo de código. No quiero almacenar y usar variables solo dentro de llaves de función. En el siguiente código, solo se escribe un archivo console.log, pero existen muchos eventos. No quiero usar buscar y luego. Quiero resolverlo usando async/await, pero todo lo que hago está mal. ¿Qué hice mal?
Prueba 1
Ejecutar => Error de sintaxis no detectado: esperar solo es válido en funciones asíncronas y los cuerpos de módulos de nivel superior
var resp = await fetch(`https://www.yahoo.com/manifest_desktop_us.json`); var jobj = await resp.json(); var display = jobj.display; console.log(display); //I need display valuePrueba 2
Ejecutar => indefinido
async function abc(url) { var resp = await fetch(url); var jobj = await resp.json(); return jobj; } var url = 'https://www.yahoo.com/manifest_desktop_us.json'; var jobj = abc(url); //var jobj = async() => await abc(url); //undefined var display = jobj.display; console.log(display); //I need display valueSu primer intento está muy cerca de hacer que funcione, el error Uncaught SyntaxError: await is only valid in async functions and the top level bodies of modules significan que await solo se puede usar dentro de una función asíncrona, por lo que debe envolverlo
(async function(){ var resp = await fetch(`https://cors- anywhere.herokuapp.com/https://www.yahoo.com/manifest_desktop_us.json`); var jobj = await resp.json(); var display = jobj.display; console.log(display); // logs "standalone" from API })();Además, también debe omitir cors , por el bien de la demostración, agregué la URL de cors , pero en su aplicación de producción debe manejarla en la instancia de solicitud HTTP global o tener su propia URL de back-end.
Puedes usar then .
const [data, setData] = useState({}) const getApi = async () => { const resp = await fetch(`https://www.yahoo.com/manifest_desktop_us.json`) return resp } getApi().then((resp) => setData(resp.json))Debe mover toda la lógica relacionada con la operación asíncrona en una función async .
Puede usar una función asíncrona anónima para eso:
(async () => { var resp = await fetch(`https://www.yahoo.com/manifest_desktop_us.json`); var jobj = await resp.json(); var display = jobj.display; console.log(display); })(); Alternativamente, dado que una función asíncrona devuelve una Promise , también puede obtener el valor en then llamada:
async function abc(url) { var resp = await fetch(url); var jobj = await resp.json(); return jobj; } var url = 'https://www.yahoo.com/manifest_desktop_us.json'; var jobj = abc(url).then((value) => console.log(value));