API
퓨처 API
Loader API

Loader API

Loader API가 기본으로 빌트인돼요. 아래와 같이 사용해요.

HomeActivity.loader.ts
import { ActivityLoaderArgs, useLoaderData } from "@stackflow/react/future";
 
export function homeActivityLoader({ params }: ActivityLoaderArgs<"HomeActivity">) {
  return {
    // ...
  }
}

자동으로 타입이 채워져요.

HomeActivity.tsx
import { homeActivityLoader } from "./HomeActivity.loader";
 
export const HomeActivity: ActivityComponentType<"HomeActivity"> = () => {
  const loaderData = useLoaderData<typeof homeActivityLoader>();
}

stackflow.config.ts 파일에 생성한 로더를 삽입해요

stackflow.config.ts
import { defineConfig } from "@stackflow/config";
import { homeActivityLoader } from "../components/HomeActivity.loader";
 
export const config = defineConfig({
  activities: [
    {
      name: "HomeActivity",
      route: "/",
      loader: homeActivityLoader,
    },
    {
      name: "MyProfileActivity",
      route: "/my-profile",
    }
  ],
  transitionDuration: 270,
});