30 lines
787 B
TypeScript
30 lines
787 B
TypeScript
import useSWR from "swr";
|
|
import type { Route } from "./+types/info";
|
|
|
|
const API_URL = "https://api.projectcvsa.com";
|
|
|
|
export async function clientLoader({ params }: Route.LoaderArgs) {
|
|
return { id: params.id };
|
|
}
|
|
|
|
export default function SongInfo({ loaderData }: Route.ComponentProps) {
|
|
const { data, error, isLoading } = useSWR(`${API_URL}/video/${loaderData.id}/info`, async (url) => {
|
|
const response = await fetch(url);
|
|
if (!response.ok) {
|
|
throw new Error("Failed to fetch song info");
|
|
}
|
|
return response.json();
|
|
});
|
|
|
|
if (isLoading) return <div>加载中...</div>;
|
|
if (error) return <div>错误: {error.message}</div>;
|
|
if (!data) return <div>暂无数据</div>;
|
|
|
|
return (
|
|
<div>
|
|
<h1>歌曲信息</h1>
|
|
<pre>{JSON.stringify(data, null, 2)}</pre>
|
|
</div>
|
|
);
|
|
}
|