我开始学习Next.js，并在没有“使用客户端”的情况下获得了下面的“非测试版不使用应用程序目录”。我后来想我应该学习它，因为Next正在实现新功能。我只是想在主页上显示一些数据，但现在我得到了一个未定义的无效JSON和错误SyntaxError：JSON中位置0处的意外标记u。然而，当我转到localhost：3000/API/quotes时，我看到了数据。
API/quotes/rout.ts

import { Quotes } from "@/app/models/quotes";
import { NextResponse } from "next/server";

export async function GET(request: Request) {
  const response = await fetch("https://type.fit/api/quotes");
  const quotesResponse: Quotes = await response.json();

  return NextResponse.json(quotesResponse);
}

page.tsx

"use client";
import { useEffect, useState } from "react";
import { Quotes } from "./models/quotes";

export default function Home() {
  const [quotes, setQuotes] = useState<Quotes>();

  useEffect(() => {
    const getQuotes = async () => {
      const response = await fetch("/api/quotes");

      const quotesResponse: Quotes = await response.json();
      setQuotes(quotesResponse);
    };

    getQuotes();
  }, []);

  return (
    <div>
      <div>{JSON.stringify(quotes)}</div>
    </div>
  );
}