# Compose Navigation - (2)
<이전 글>
https://www.wanted.co.kr/community/post/102272?utm_source=wanted&utm_medium=share
이번 글에서는 인수를 통한 탐색, 딥링크, 중첩 그래프에 대해서 알아보겠습니다.
💡 Navigate with arguments(인수를 통한 탐색)
1️⃣ 기본 사용법
Navigation Compose에서는 아래와 같이 인수를 전달할 수가 있습니다.
```kotlin
NavHost(startDestination = "profile/{userId}") {
...
composable("profile/{userId}") {...}
}
```
이렇게 하면 기본으로 모든 인수는 String 값으로 파싱이됩니다. (여기서는 userId)
2️⃣ 인수 타입 지정
“composable()”의 “arguments” 인자에 “NamedNavArgument”를 넘김으로서 정확한 타입을 명시해줄 수 있으며, “NamedNavArgument”는 “navArgument()” 메서드를 사용하여 생성할 수 있습니다.
```kotlin
NavHost(startDestination = "profile/{userId}") {
...
composable(
"profile/{userId}",
arguments = listOf(navArgument("userId") { type = NavType.StringType })
) {...}
}
```
전달 받을 수 있는 타입은 아래 문서를 참고해주세요.
https://developer.android.com/guide/navigation/use-graph/pass-data#supported_argument_types
3️⃣ 값을 전달 받는 방법
- Composable의 BackStackEntry를 통해서 값을 전달받을 수 있습니다.
```kotlin
composable("profile/{userId}") { backStackEntry ->
Profile(navController, backStackEntry.arguments?.getString("userId"))
}
```
- AAC ViewModel을 통해 생성자로 SavedStateHandle를 받아서 값을 전달 받을 수 있습니다. 이 접근 방식은 구성 변경 중에 데이터 손실을 방지하고 해당 객체가 업데이트되거나 변형될 때 불일치를 방지하는 데 도움이 됩니다.
```kotlin
class UserViewModel(
savedStateHandle: SavedStateHandle,
private val userRepository: UserRepository
) : ViewModel() {
private val userId: String = checkNotNull(savedStateHandle["userId"])
private val userInfo: Flow<UserInfo> = userRepository.getUserInfo(userId)
}
```
💡 Deep links (딥링크)
Navigation Compose는 composable() 함수의 일부로 정의할 수 있는 암시적 딥 링크를 지원합니다. deepLinks 매개변수에 NavDeepLink 객체의 리스트를 받으며, navDeepLink() 메서드를 사용하여 생성할 수 있습니다.
```kotlin
val uri = "https://www.example.com"
composable(
"profile?id={id}",
deepLinks = listOf(navDeepLink { uriPattern = "$uri/{id}" })
) { backStackEntry ->
Profile(navController, backStackEntry.arguments?.getString("id"))
}
```
💡 Nested Navigation (중첩 네비게이션)
앱 내의 로그인 플로우, 실행, 작업 등을 도와주는 플로우 또는 기타 하위 플로우는 일반적으로 중첩된 네비게이션 그래프로 표현할 수 있습니다. 자체 포함된 하위 네비게이션 플로우를 중첩함으로써, 앱 UI의 주요 플로우를 이해하고 관리하기가 더 쉬워집니다.
중첩된 그래프는 재사용할 수 있습니다. 또한 캡슐화 수준을 제공합니다. 중첩된 그래프 외부의 목적지는 중첩된 그래프 내의 어떤 목적지에도 직접 액세스할 수 없습니다. 대신, 중첩된 그래프 자체로 navigate() 해야 하며, 내부 로직을 변경해도 그래프의 나머지 부분에 영향을 주지 않습니다.
1️⃣ 사용방법
Compose를 사용하여 중첩된 네비게이션 그래프를 생성하려면 NavGraphBuilder.navigation() 함수를 사용합니다. 이 함수는 새로운 목적지를 추가하는 것이 아니라 중첩된 그래프를 생성합니다. 그런 다음 navigation의 람다 내에서 composable() 또는 dialog()를 호출하여 중첩된 그래프에 목적지를 추가합니다.
참고 : https://developer.android.com/guide/navigation/design/nested-graphs#compose
