I'm trying to render some data that I'm fetching from the Open Trivia DB. But when I try to map an array (which is the value of am object property), I get undefined on the console.
For now, I want to console.log the array within the object property when the state changes. Later I want to map the results Array to properly render some of the data within the array of objects.
Here's my code:
export default function App(){
const [quizScreen, setQuizScreen] = useState(false)
const questions = (
fetch('https://opentdb.com/api.php?amount=5&category=26&difficulty=medium')
.then(res => res.json())
.then(data => data)
)
const startQuiz = () => {
setQuizScreen(prevScreen => !prevScreen)
console.log(questions.results) //works if I log questions, but not questions.results
}
This is the data:
{
"response_code":0,
"results":[
{
"category":"Celebrities",
"type":"multiple",
"difficulty":"medium",
"question":"Which actress's real name was Frances Ethel Gumm?",
"correct_answer":"Judy Garland",
"incorrect_answers":[
"Doris Day",
"Julie Andrews",
"Marilyn Monroe"
]
},
{
"category":"Celebrities",
"type":"multiple",
"difficulty":"medium",
"question":"What is the real name of "moot", founder of the imageboard 4chan?",
"correct_answer":"Christopher Poole",
"incorrect_answers":[
"Mark Zuckerberg",
"Allison Harvard",
"Catie Wayne"
]
},
{
"category":"Celebrities",
"type":"multiple",
"difficulty":"medium",
"question":"Before voicing Pearl in Steven Universe, Deedee Magno Hall was part of which American band?",
"correct_answer":"The Party",
"incorrect_answers":[
"The Weather Girls",
"The Pussycat Dolls",
"The Cheetah Girls"
]
},
{
"category":"Celebrities",
"type":"multiple",
"difficulty":"medium",
"question":"Who out of these actresses is the youngest?",
"correct_answer":"Kiernan Shipka",
"incorrect_answers":[
"Ariel Winter",
"Emma Watson",
"Bonnie Wright"
]
},
{
"category":"Celebrities",
"type":"multiple",
"difficulty":"medium",
"question":"Who is "James Rolfe" better known as?",
"correct_answer":"The Angry Video Game Nerd",
"incorrect_answers":[
"TotalBiscuit",
"PeanutButterGamer",
"PewDiePie"
]
}
]
}