Skip to content
33 changes: 23 additions & 10 deletions docs/pages/docs/get-started/navigating-activities.ko.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -135,10 +135,7 @@ replace(

마지막으로 현재 액티비티를 삭제하고 이전 액티비티로 돌아가는 방법에 대해서 살펴봐요. `stackflow.ts`에서 생성했던 `useFlow()` 훅의 `pop()` 함수를 통해 다음과 같이 현재 액티비티를 삭제할 수 있어요.

```tsx
/**
* Article.tsx
*/
```tsx showLineNumbers filename="Article.tsx" copy /pop/
import { ActivityComponentType } from "@stackflow/react";
import { AppScreen } from "@stackflow/plugin-basic-ui";
import { useFlow } from "./stackflow";
Expand All @@ -150,15 +147,22 @@ type ArticleParams = {
const Article: ActivityComponentType<ArticleParams> = ({ params }) => {
const { pop } = useFlow();

const onClick = () => {
const goBack = () => {
// 액티비티 하나만 제거
pop();
};

const goBackMultiple = () => {
// 액티비티 여러 개 제거
pop(3);
};

return (
<AppScreen appBar={{ title: "Article" }}>
<div>
<h1>{params.title}</h1>
<button onClick={onClick}>back</button>
<button onClick={goBack}>Back</button>
<button onClick={goBackMultiple}>Back 3 Steps</button>
</div>
</AppScreen>
);
Expand All @@ -167,17 +171,26 @@ const Article: ActivityComponentType<ArticleParams> = ({ params }) => {
export default Article;
```

`pop()`은 첫번째 파라미터로 추가 옵션을 받아요. 첫번째 파라미터인 추가 옵션은 선택적으로 넘기지 않을 수 있어요. (기본값을 사용해요)
`pop()` 함수는 제거할 스택 개수와 추가 옵션을 위한 선택적 파라미터를 받을 수 있어요.
첫번째 파라미터는 생략 가능하며, 생략 시 기본값이 사용돼요.

```ts
pop();
pop(); // 스택 하나 제거

pop(3); // 스택 여러 개 제거

// 또는
pop({
/* 추가 옵션 */
});
}); // 추가 옵션과 함께 스택 하나 제거

pop(3, {
/* 추가 옵션 */
}); // 추가 옵션과 함께 스택 여러 개 제거
```

`pop()` 함수의 첫번째 파라미터는 제거할 스택의 개수를 지정하거나 추가 옵션을 정의할 수 있어요.
첫번째 파라미터를 스택 개수로 사용하면, 두 번째 매개변수는 추가 옵션을 전달하는 데 사용할 수 있어요.

`pop()` 함수의 첫번째 파라미터인 추가 옵션에는 다음과 같은 값이 있어요.

<APITable hasDefaultValue>
Expand Down