请查看以下模式是否适合您。其想法是在服务器组件中获取用户详细信息，并将用户详细信息传递给客户端组件，该客户端组件创建用户上下文，该用户上下文可以在React树的任何客户端组件中使用。

import UserContextProvider from "@/app/UserContext";
import ClientComponent from "@/app/ClientComponent";

// setting revalidate to 0 for testing purpose
export const revalidate = 0;

async function fetchUser() {
  return { name: "John Doe", email: "john.doe@example.com" };
}

export default async function Home() {
  const user = await fetchUser();

  return (
    <UserContextProvider user={user}>
      <ClientComponent />
    </UserContextProvider>
  );
}

// UserContext.tsx

"use client";

import * as React from "react";

type UserContextType = {
  name: string;
  email: string;
};

const UserContext = React.createContext<UserContextType | null>(null);

export function useUserContext() {
  const context = React.useContext(UserContext);
  if (context) return context;
  throw new Error("useUserContext must be used within UserContext.Provider");
}

export default function UserContextProvider({
  user,
  children,
}: React.PropsWithChildren & { user: UserContextType }) {
  return <UserContext.Provider value={user}>{children}</UserContext.Provider>;
}

// ClientComponent.tsx

"use client";

import { useUserContext } from "@/app/UserContext";

export default function ClientComponent() {
  const user = useUserContext();

  return (
    <>
      <p>{user.name}</p>
      <p>{user.email}</p>
    </>
  );
}