Github APIの処理

Github APIを介してユーザのレポートを受信し、選択したレポートの問題を収集する機能を作成しました.

以下のリンクを使用して、クローンを直接使用できます.
ネクタイ

repository

次はRepositoryをロードするコードです.

await axios
  .get(`https://api.github.com/users/${username}/repos`, {
	headers: {
		Accept: "application/vnd.github.nightshade-preview+json",
				// Authorization: `Token b6b4269b1...`,
		},
	})
	.then((el) => changeHandler(el.data));

以上のコードのchangeHandlerはpropとして受信されるハンドルである.

const changeHandler = (data) => {
	const repoData = JSON.stringify(data);
	localStorage.setItem("repoData", repoData);
	setToggle(!toggle);
};

プロセッサにデータを送信すると、repoDataの名前でローカルストレージにデータが格納されます.
URLは以下の通りです.

https://api.github.com/users/$유저이름/repos

issue

次に、問題をロードするコードを示します.

// repoRegister 개수만큼 요청 후 해당 이슈만큼 map으로 뿌려줌
useEffect(() => {
	// 처음 불러올때 초기화
	let temp = [];
	const username = localStorage.getItem("username");
	const repoRegister = JSON.parse(localStorage.getItem("repoRegister"));

	if (repoRegister) {
		const getRepo = async () => {
			for (let i = 0; i < repoRegister.length; i++) {
				let url = `htts://api.github.com/repos/${username}/${repoRegister[i].name}/issues`;

				await axios
					.get(url, {
						headers: {
							Accept: "application/vnd.github.nightshade-preview+json",
						},
					})
					.then((res) =>
						res.data.forEach((el) => {
							el.repo = repoRegister[i].name;
							temp.push(el);
						})
					);
			}
			setLoading(!loading);
			setIssue(temp);
		};
		getRepo();
	}
	}, []);

ローカルストレージに格納されている2つのユーザー名(アカウント名)と再登録器(登録済みリポジトリ)がロードされます.これは、問題リクエストのURLを発行するために使用する必要があるためです.
また、問題を一時的に置く案も発表された.

質問を求めるURLは次のとおりです.

https://api.github.com/repos/유저이름/레포지토리이름/issues

1ページに格納されているすべてのレポートの問題を表示する必要があるため、for文を使用してレポートの数を要求します.

ヘッダの「リクエストを受け入れる」ことを忘れずに、リクエストの内容を一時的に作成した配列に追加します.

すべての重複が完了した場合は、一時的に作成したシナリオを管理中の問題シナリオに挿入します.
ロードも終わろう

setLoading(!loading);
setIssue(temp);

がUSEffectですべてのコンテンツを上書きし、reportRegisterがある場合にのみ条件文を保留すると完了します.

リファレンス

正式な書類
hyun-jii.log