我正在从github API获取数据到我的网站。我试图使用topics=“tailwindcss”作为查询。它显示了所有以tailwindcss为主题的repo。enter image description here现在我在pomodoro repo中添加tailwindcss作为主题。它显示在postman API调用中

{
        "id": 693490688,
        "node_id": "R_kgDOKVXUAA",
        "name": "pomodoro",
        "full_name": "ARITRA69/pomodoro",
        "private": false,
        "owner": {
            ...
        },
        "html_url": "https://github.com/ARITRA69/pomodoro",
        "description": null,
        ...
        "topics": [
            "featured",
            "tailwindcss"
        ],
        "visibility": "public",
        ...
    },

字符串
正如你所看到的。但是番茄工作法并没有在我的API调用中显示出来

验证码：

API调用：

const GITHUB_TOKEN = process.env.NEXT_PUBLIC_GITHUB_ACCESS_TOKEN;

export default async function getRepos() {
try {
    const response = await fetch("https://api.github.com/users/aritra69/repos",
        {
            headers: {
                Authorization: `token ${GITHUB_TOKEN}`,
            },
        }
    );
const repos = await response.json();

    const filteredRepos = Array.isArray(repos)
      ? repos.filter(
          (repo) =>
            repo.topics &&
            repo.topics.length > 0 &&
            repo.topics.includes("tailwindcss")
        )
      : [];
    return filteredRepos;

} catch (error) {
      throw new Error("Failed to fetch users");
  }
}

型
显示数据：

import React from "react";
import Link from "next/link";
import getRepos from "@/lib/getRepos";
import ProjectCard from "@/components/ProjectCard";

const Projects = async () => {
  const repos = await getRepos();

  return (
    <div className="min-h-screen w-11/12 xl:w-[55%] mx-auto mt-36 space-y-36">
      <Link
        href="/"
        className="text-foreground/50 group hover:text-foreground/80 transition-all duration-500 flex items-center gap-2"
      >
        <span className="group-hover:-translate-x-2 transition-all duration-500">
          ←
        </span>
        <span>Go Back</span>
      </Link>
      <div className="grid grid-cols-1 sm:grid-cols-2 gap-10 justify-items-center pb-36">
        {repos.map((repo) => (
          <ProjectCard
            key={repo.id}
            name={repo.name}
            href={repo.html_url}
            description={repo.description}
            language={repo.language}
            topics={repo.topics}
          />
        ))}
      </div>
    </div>
  );
};

export default Projects;

型
项目卡片：

import Link from "next/link";
import React from "react";

type Props = {
  key: number;
  name: string;
  href: string;
  description: string;
  language: string;
  topics: [string];
};

const ProjectCard = ({ name, href, description, language, topics }: Props) => {
  function convertAndUppercase(name: string) {
    return name
      .replace(/-/g, " ")
      .split(" ")
      .map((word) => word.charAt(0).toUpperCase() + word.slice(1))
      .join(" ");
  }

  return (
    <div className="w-full p-5 bg-neutral-900 rounded-xl flex flex-col justify-between gap-y-10">
      <Link href={`/projects/${name}`} className="flex flex-col">
        <h1 className="text-base md:text-lg hover:text-foreground/70 transition-all duration-500 ease-in-out">
          {convertAndUppercase(name)}
        </h1>
        <p className="text-foreground/50 text-xs md:text-sm">{description}</p>
      </Link>
      <div className="flex items-center justify-between gap-10">
        <div className="flex items-center gap-1">
          {language && (
            <>
              <div className="h-3 w-3 rounded-full bg-gray-600"></div>
              <p className="text-xs">{language}</p>
            </>
          )}
        </div>
        <div className="flex gap-1 text-xs text-foreground/60 flex-wrap">
          {topics.map((topic, i) => (
            <p
              key={i}
              className="py-1 px-2 rounded-full bg-background/50 whitespace-nowrap"
            >
              #{topic}
            </p>
          ))}
        </div>
      </div>
    </div>
  );
};

export default ProjectCard;

型
我在想，API可能需要很长的时间来更新。但如果是这样的话，那么它将不会在 Postman 更新