域名 AXUM.RS 将于 2025 年 10 月到期。我们无意再对其进行续费,如果你有意接续这个域名,请与我们取得联系。
  • AXUM.RS 现仅需人民币 3000 元(大写:叁仟元整。接受适度议价
  • 按照行业规则,AXUM.RS 到期后,大概率会进入长时间的赎回期,该期间内,如果你想拥有该域名,将要付出高额的费用
  • 我们已启用 AXUM.EU.ORG 域名,并将持续运营
  • 仅接受微信或支付宝交易
如果你对 AXUM.RS 有兴趣,请和我们进行联系:

“正在载入”的实现

博客列表

// app/post/page.js

import Link from "next/link";

export default async function PostList() {
  const res = await fetch("https://jsonplaceholder.typicode.com/posts");
  const postList = await res.json();

  return (
    <>
      <ul>
        {postList.map((p) => (
          <li key={p.id}>
            <Link href={`/post/${p.id}`}>{p.title}</Link>
          </li>
        ))}
      </ul>
    </>
  );
}
// app/post/[id]/page.js

import React from "react";

export default function PostDetailLoading() {
  return (
    <div style={{ color: "blue", border: "1px solid #000", padding: "1rem" }}>
      正在载入……
    </div>
  );
}

根目录下创建loading.js

// app/loading.js
import React from "react";

export default function Loading() {
  return (
    <div style={{ color: "red", border: "1px solid #000", padding: "1rem" }}>
      正在载入……
    </div>
  );
}

import React from "react";

export default function PostDetailLoading() {
  return (
    <div style={{ color: "blue", border: "1px solid #000", padding: "1rem" }}>
      正在载入……
    </div>
  );
}

本章代码位于04/loading分支

要查看完整内容,请先登录