Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

72
Views
Setting state when dealing with promises?

I've been reading through Stack Overflow on this and struggling to solve my issue. I am still very junior, so I may have read the correct fix and been to dense to understand it.

The intention is set a piece of React state to the returned object from an API query.

That being said, here's the code. EDIT: fixed the props

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>
  )
};

The console.log(data) yields the result I'd like, but I know I am incorrectly resolving this promise. The error yielded is below:

Uncaught (in promise) TypeError: setBackground is not a function
    at backgroundQuery (Background.js:9:1)
about 4 years ago · Juan Pablo Isaza
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!