实际上，我正在按照本教程https://www.youtube.com/watch?v=VTY6ZzDTV3A&t=197s在react.js中处理Twitch Tv 仪表板
一切正常，但我的 twitch api 无法正常工作，请谁能帮我解决这个错误。
这是我的控制台中显示的错误：
Uncaught (in promise) Error: Request failed with status code 401
createError createError.js:16
settle settle.js:17
handleLoad xhr.js:61
createError.js:16
fetchData Games.js:30
AsyncFunctionThrow self-hosted:697
这是我正在处理的代码，如下所示：
游戏.js：
import React, { useState, useEffect } from "react";
import api from "../api";
import { Link } from "react-router-dom";
function Games() {
const [games, setGames] = useState([]);
useEffect(() => {
const fetchData = async () => {
const result = await api.get("https://api.twitch.tv/helix/games/top");
// console.log(result.data);
let dataArray = result.data.data;
let finalArray = dataArray.map(game => {
let newURL = game.box_art_url
.replace("{width}", "300")
.replace("{height}", "300");
game.box_art_url = newURL;
})
setGames(result.data.data);
};
fetchData();
});
return (
<div>
<h1>Most Popular Games</h1>
<div className="row">
{games.map(game => (
<div className='col-4'>
<div className='card'>
<img className="card-img-top" src={game.box_art_url} />
<div className="card-body">
<h5 className="card-title">{game.name}</h5>
<button className="btn btn-success">
<Link
className="link"
to={{
pathname: "game/" + game.name,
state: {
gameID: game.id
}
}}
>
{game.name} streams{" "}
</Link>
</button>
</div>
</div>
</div>
))}
</div>
</div>
);
}
export default Games;
除此之外，这是我添加 twitch tv api id 的 api.js 文件：
import axios from 'axios';
let api = axios.create({
headers: {
"Client-ID": '4mfy053h9jf3zqwy3fh1pi55oadib1'
}
});
export default api;