You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: src/content/docs/ko/guides/view-transitions.mdx
+5-15Lines changed: 5 additions & 15 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -391,27 +391,17 @@ import { ClientRouter } from "astro:transitions";
391
391
</html>
392
392
```
393
393
394
-
`navigate` 메서드는 다음 인수를 사용합니다.
395
-
396
-
-`href` (필수) - 탐색할 새 페이지입니다.
397
-
-`options` - 다음 속성을 가진 선택적 객체입니다.
398
-
-`history`: `"push"` | `"replace"` | `"auto"`
399
-
-`"push"`: 라우터는 `history.pushState`를 사용하여 브라우저 기록에 새 항목을 만듭니다.
400
-
-`"replace"`: 라우터는 `history.replaceState`를 사용하여 탐색에 새 항목을 추가하지 않고 URL을 업데이트합니다.
401
-
-`"auto"` (기본값): 라우터는 `history.pushState`를 시도하지만, URL이 전환할 수 없는 URL인 경우 브라우저 기록을 변경하지 않고 현재 URL을 유지합니다.
402
-
-`formData`: `POST` 요청을 위한 [`FormData`](https://developer.mozilla.org/ko/docs/Web/API/FormData) 객체입니다.
403
-
404
394
브라우저 기록을 통한 역방향 및 정방향 탐색을 위해 `navigate()`를 브라우저의 내장 함수인 `history.back()`, `history.forward()` 및 `history.go()`와 결합할 수 있습니다. 컴포넌트의 서버 측 렌더링 중에 `navigate()`가 호출되면 아무런 효과가 없습니다.
405
395
396
+
<ReadMore>[`navigate()` 옵션](/ko/reference/modules/astro-transitions/#navigate)에 대한 자세한 내용은 `astro:transitions` 참조를 확인하세요.</ReadMore>
397
+
406
398
### 브라우저 기록의 항목 바꾸기
407
399
408
400
일반적으로 탐색할 때마다 새 항목이 브라우저 기록에 추가됩니다. 이를 통해 브라우저의 `뒤로` 및 `앞으로` 버튼을 사용하여 페이지 간 탐색이 가능합니다.
409
401
410
402
`<ClientRouter />` 라우터를 사용하면 개별 `<a>` 태그에 `data-astro-history` 속성을 추가하여 기록 항목을 재정의할 수 있습니다.
411
403
412
-
`data-astro-history` 속성은 [`navigate()` 함수의 `history` 옵션](#탐색-트리거)과 동일한 세 가지 값으로 설정할 수 있습니다.
`data-astro-history` 속성은 [`navigate()` 함수의 `history` 옵션](/ko/reference/modules/astro-transitions/#history-옵션)과 동일한 세 가지 값으로 설정할 수 있습니다.
415
405
416
406
-`"push"`: 라우터는 `history.pushState`를 사용하여 브라우저 기록에 새 항목을 만듭니다.
417
407
-`"replace"`: 라우터는 `history.replaceState`를 사용하여 탐색에 새 항목을 추가하지 않고 URL을 업데이트합니다.
@@ -632,7 +622,7 @@ Astro의 뷰 전환 API 수명 주기 이벤트는 순서대로 다음과 같습
632
622
- 외부 URL이 아닌 템플릿에 정의된 콘텐츠를 로드하는 등 로딩을 변경합니다.
633
623
- 사용자 정의 애니메이션을 위해 탐색 `direction` (일반적으로 `forward` 또는 `backward`)을 변경합니다.
634
624
635
-
다음은 콘텐츠가 로드되기 전에 스피너를 로드하고 로드 직후 중지하기 위해 `astro:before-preparation` 이벤트를 사용하는 예시입니다. 이러한 방식으로 `loader`콜백을 사용하면 코드의 비동기 실행이 가능합니다.
625
+
다음은 콘텐츠가 로드되기 전에 스피너를 로드하고 로드 직후 중지하기 위해 `astro:before-preparation` 이벤트를 사용하는 예시입니다. 이러한 방식으로 [`loader`콜백](/ko/reference/modules/astro-transitions/#loader)을 사용하면 코드의 비동기 실행이 가능합니다.
636
626
637
627
```astro
638
628
<script is:inline>
@@ -704,7 +694,7 @@ Astro의 뷰 전환 API 수명 주기 이벤트는 순서대로 다음과 같습
704
694
705
695
<p><Sincev="4.15.0" /></p>
706
696
707
-
`astro:transitions/client` 모듈의 `swapFunctions`객체는 문서 속성, 페이지 요소 및 스크립트 실행 처리를 포함하여 특정 교체 관련 작업을 처리하는 5가지 유틸리티 함수를 제공합니다. 이러한 함수는 사용자 정의 교체 구현을 정의하는 데 직접 사용할 수 있습니다.
697
+
`astro:transitions/client` 모듈의 [`swapFunctions`객체](/ko/reference/modules/astro-transitions/#swapfunctions)는 문서 속성, 페이지 요소 및 스크립트 실행 처리를 포함하여 특정 교체 관련 작업을 처리하는 5가지 유틸리티 함수를 제공합니다. 이러한 함수는 사용자 정의 교체 구현을 정의하는 데 직접 사용할 수 있습니다.
708
698
709
699
다음 예제는 이러한 함수를 사용하여 Astro의 내장 교체 구현을 재현하는 방법을 보여줍니다.
0 commit comments