如何从 Compose-Navigation 的返回堆栈中移除可组合项

Question

我的应用程序中有一个屏幕，允许用户编辑数据库中的项目，在用户完成编辑项目后，他们单击“完成”按钮，将他们带到上一个屏幕。 但是当用户点击后退按钮时，他们将再次进入编辑屏幕。

我想要的是当用户点击后退按钮时转到另一个屏幕，就像他们从未去过编辑屏幕一样。

这是我的导航图：

@Composable
fun AppNavigator(
    textFieldsViewModel: TextFieldsViewModel,
    shoppingListsViewModel: ShoppingListsViewModel,
    addNewShoppingListViewModel: AddNewShoppingListViewModel
) {

    val navController = rememberNavController()

    NavHost(navController, startDestination = "SplashScreen") {
        composable("SplashScreen") {
            SplashScreen(navController = navController)
        }
        composable("shoppingLists") {
            ShoppingListsScreen(
                navController = navController,
                shoppingListsViewModel = shoppingListsViewModel,
                textFieldsViewModel = textFieldsViewModel
            )
        }
        composable(
            "ItemsList/{listID}",
            arguments = listOf(navArgument("listID") { type = NavType.IntType })
        ) {
            ShoppingListItemsScreen(
                it.arguments?.getInt("listID")!!,
                shoppingListsViewModel = shoppingListsViewModel,
                textFieldsViewModel = textFieldsViewModel,
                navController = navController
            )
        }
        composable(
            "EditItem/{itemId},{itemName},{itemQuantity},{itemParentListId}",
            arguments = listOf(
                navArgument("itemId") { type = NavType.IntType },
                navArgument("itemName") { type = NavType.StringType },
                navArgument("itemQuantity") { type = NavType.IntType },
                navArgument("itemParentListId") { type = NavType.IntType })
        ) {
            EditItemScreen(
                navController = navController,
                textFieldsViewModel = textFieldsViewModel,
                shoppingListsViewModel = shoppingListsViewModel,
                itemId = it.arguments?.getInt("itemId")!!,
                itemName = it.arguments?.getString("itemName")!!,
                itemQuantity = it.arguments?.getInt("itemQuantity")!!,
                itemParentListId = it.arguments?.getInt("itemParentListId")!!
            )
        }
        composable("AddNewShoppingList") {
            AddNewShoppingListScreen(
                navController = navController,
                textFieldsViewModel = textFieldsViewModel,
                addNewShoppingListViewModel = addNewShoppingListViewModel,
                shoppingListsViewModel = shoppingListsViewModel
            )
        }

    }
}

下面是负责导航到上一个可组合项的按钮代码：

 IconButton(
                onClick = {
                    shoppingListsViewModel.addNewItemToShoppingList(item)
                    navController.navigate("ItemsList/${changeableParentListId.value}")
                }) {
                Icon(Icons.Rounded.Done, "Save or Edit the Shopping Item")
            }

这是编辑屏幕的屏幕截图： enter image description here

Answer 1

您应该从 edit/details 屏幕调用 navController.popBackStack()。