Tengo una matriz de objetos y necesito obtener una sola propiedad, pero no está definida y no tengo idea de por qué. ¿Alguien sabe cómo resolver?
const [questions, setQuestions] = useState({}); const [index, setIndex] = useState(0); async function handleQuestions() { const fetchQuestions = await fetchTriviaApi(); setQuestions(fetchQuestions.results); } useEffect(() => { handleQuestions(); }, []);Devolución de preguntas:
(5) [{…}, {…}, {…}, {…}, {…}] 0: {category: 'Entertainment: Music', type: 'boolean', difficulty: 'medium', question: 'Rapper Snoop Dogg's real name is 'Cordozar Calvin Broadus, Jr.'.', correct_answer: 'True', …} 1: {category: 'Entertainment: Video Games', type: 'multiple', difficulty: 'medium', question: 'Which of these "Worms" games featured 3D gameplay?', correct_answer: 'Worms 4: Mayhem', …} 2: {category: 'Vehicles', type: 'multiple', difficulty: 'easy', question: 'What UK Train does NOT go over 125MPH?', correct_answer: 'Sprinter', …} 3: {category: 'Entertainment: Video Games', type: 'boolean', difficulty: 'medium', question: 'Tony Hawk's Pro Skater was released in 1999.', correct_answer: 'True', …} 4: {category: 'Entertainment: Video Games', type: 'boolean', difficulty: 'hard', question: 'In The Witcher 3, the Zoltan Chivay Gwent card can be found under the Hanged Man's Tree.', correct_answer: 'True', …} length: 5Devolución de preguntas[índice]:
{category: 'Entertainment: Music', type: 'boolean', difficulty: 'medium', question: 'Rapper Snoop Dogg's real name is 'Cordozar Calvin Broadus, Jr.'.', correct_answer: 'True', …}Devolución de preguntas[índice].categoría: Cuando trato de acceder a cualquier propiedad, devuelve indefinido.
Debe inicializar el estado de las questions en una matriz vacía.
const [questions, setQuestions] = useState([]); Y al acceder a los elementos, debe verificar si las questions se completan con la llamada API.
{questions.length > 0 && questions[index].category}Lo más probable es que su búsqueda no se esté esperando correctamente. También debe esperar el json(). Y recuerda que setState es asíncrono y no inmediato. Solo en el próximo renderizado estará seguro de haber cambiado los datos.
Tal vez porque está inicializando el estado de sus preguntas como un objeto, por lo que las preguntas [1] no están definidas tan pronto como se resuelve handleQuestions.