我一直在做一个反应项目,在过去的两天内无法解决此问题。我的提取工作正常,并向我返回了测验列表。但是由于某种原因,我无法在渲染中显示它们。在chrome devTools中,我检查了状态并进行了更新。我尝试将response2.quizzes,newGames,games.concat(newGames)和所有其他可能性传递给setGames。它不会工作。下面是代码。任何帮助将不胜感激,因为我是新来的反应者。谢谢
const [games, setGames] = React.useState([]);
const token = localStorage.getItem('token');
const getListofGames = async () => {
getMethodOptions.headers.Authorization = token
const response = await fetch(`${BASE_URL}/admin/quiz`, getMethodOptions);
if (response.status === 200) {
const response2 = await response.json();
const newGames = [];
newGames.push(response2.quizzes);
console.log(newGames);
setGames([...newGames]);
}
};
React.useEffect(() => {
getListofGames();
console.log(games);
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);
return (
<>
<NavBar />
<CreateNewGameBar />
<div>
Create Games Appear here
</div>
{games.length > 0 && games.map(({id, name, thumbnail}) => (
<QuizCard
quizId={id}
quizName={name}
thumbnail={thumbnail}
/>
))}
</>
);
}
export default Dashboard;```