He estado leyendo Stack Overflow sobre esto y tengo problemas para resolver mi problema. Todavía soy muy joven, por lo que es posible que haya leído la solución correcta y haya sido demasiado denso para entenderlo.

La intención es establecer una parte del estado React en el objeto devuelto desde una consulta API.

Dicho esto, aquí está el código. EDITAR: arreglado los accesorios

 export const Background = ({background, setBackground}) => { //goal is to query a random land and set the background to the full art of that land on page load const backgroundQuery = async () => { const query = "https://api.scryfall.com/cards/random?q=%28type%3Aland%29+is%3Aartcrop" const response = await fetch(query); console.log(response) const data = await response.json(); console.log(data); setBackground(data); } return( <div> {background.length && <image src={background.image_uris.art_crop} alt="background image, basic full art mtg land"></image>} <button onClick={backgroundQuery}> Get Image </button> </div> ) };

Console.log(data) produce el resultado que me gustaría, pero sé que estoy resolviendo incorrectamente esta promesa. El error producido es el siguiente:

 Uncaught (in promise) TypeError: setBackground is not a function at backgroundQuery (Background.js:9:1)