ลองจินตนาการว่าแอปของคุณมีจุดหมาย 3 แห่ง ได้แก่ A, B และ C และยังมีการดำเนินการที่
นำจาก A ไป B ไป B ไป C และ C กลับไปสู่ A กราฟการนำทางที่เกี่ยวข้อง
จะปรากฏดังนี้
วันที่ รูปที่ 1 กราฟการนำทางแบบวงกลมที่มีจุดหมาย 3 แห่ง ได้แก่ A, B และ C
ในการใช้การนำทางแต่ละครั้ง NavController จะเพิ่มจุดหมายใหม่ลงใน
Back Stack ดังนั้น การนำทางซ้ำๆ ตามขั้นตอนในแผนภาพ
ทำให้สแต็กด้านหลังของคุณประกอบด้วยชุดปลายทางหลายชุดดังนี้ A, B
C, A, B, C, A, B, C
พิจารณากรณีที่เมื่อไปถึงปลายทาง C แล้ว สแต็กแบ็กสแต็กจะมีค่า 1 รายการ
อินสแตนซ์ของแต่ละปลายทาง: A, B, C คุณต้องตรวจสอบว่าได้กำหนด
popUpTo() และ inclusive ในการดำเนินการหรือการเรียกไปยัง navigate() ที่ดำเนินการ
ผู้ใช้จากปลายทาง C ไปยังปลายทาง A
ในกรณีนี้ เมื่อผู้ใช้นำทางจากปลายทาง C กลับไปยังปลายทาง A
NavController ก็ปรากฏขึ้นที่ A ด้วย ซึ่งหมายความว่าจะนำ B และ C ออกจาก
กองซ้อน ด้วย inclusive = true โมเดลนี้ก็จะโดดเด่นด้วย A กลุ่มแรกอย่างมีประสิทธิภาพ
การล้างกองซ้อน
// When creating your `NavGraph` in your `NavHost`.composable("c"){DestinationC(onNavigateToA={navController.navigate("a"){popUpTo("a"){inclusive=true}}},)}
[[["เข้าใจง่าย","easyToUnderstand","thumb-up"],["แก้ปัญหาของฉันได้","solvedMyProblem","thumb-up"],["อื่นๆ","otherUp","thumb-up"]],[["ไม่มีข้อมูลที่ฉันต้องการ","missingTheInformationINeed","thumb-down"],["ซับซ้อนเกินไป/มีหลายขั้นตอนมากเกินไป","tooComplicatedTooManySteps","thumb-down"],["ล้าสมัย","outOfDate","thumb-down"],["ปัญหาเกี่ยวกับการแปล","translationIssue","thumb-down"],["ตัวอย่าง/ปัญหาเกี่ยวกับโค้ด","samplesCodeIssue","thumb-down"],["อื่นๆ","otherDown","thumb-down"]],["อัปเดตล่าสุด 2025-07-27 UTC"],[],[],null,["# Circular navigation\n\nA clear example of where you need to pop back to a destination is when your\nnavigation is circular. This document outlines that use case.\n\nScenario\n--------\n\nImagine your app has three destinations: A, B, and C. It also has actions that\nlead from A to B, B to C, and C back to A. The corresponding navigation graph\nappears as follows:\n**Figure 1.** A circular navigation graph with three destinations: A, B, and C.\n\nWith each navigation action, the `NavController` adds the new destination to the\nback stack. As such, repeatedly navigating through the flow in the diagram would\ncause your back stack would to contain multiple sets of each destination: A, B,\nC, A, B, C, A, B, C.\n\nSolution\n--------\n\nTo avoid repetition in your back stack, specify [`popUpTo()`](/guide/navigation/backstack#pop) and\n[`inclusive`](/guide/navigation/backstack#pop-back-destination) in your call to `NavController.navigate()` or in your\nnavigation action.\n\nConsider a case where after reaching destination C, the back stack contains one\ninstance of each destination: A, B, C. You need to ensure that you have defined\n`popUpTo()` and `inclusive` in the action or call to `navigate()` that takes the\nuser from destination C to destination A.\n\nIn this case, when the user navigates from destination C back to destination A,\nthe `NavController` also pops up to A. This means that it removes B and C from\nthe stack. With `inclusive = true`, it also pops the first A, effectively\nclearing the stack.\n| **Note:** This is similar to calling [`popBackStack()` and passing `inclusive`](/guide/navigation/backstack#pop-back-destination).\n\n### Compose implementation\n\nThe following is the implementation of the solution for circular `popUpTo()` in\nCompose: \n\n // When creating your `NavGraph` in your `NavHost`.\n composable(\"c\") {\n DestinationC(\n onNavigateToA = {\n navController.navigate(\"a\") {\n popUpTo(\"a\") {\n inclusive = true\n }\n }\n },\n )\n }\n\n### Views implementation\n\nThe following is the implementation of the solution for circular `popUpTo` in\nViews: \n\n \u003cfragment\n android:id=\"@+id/c\"\n android:name=\"com.example.myapplication.C\"\n android:label=\"fragment_c\"\n tools:layout=\"@layout/fragment_c\"\u003e\n\n \\\u003caction\n android:id=\"@+id/action_c_to_a\"\n app:destination=\"@id/a\"\n app:popUpTo=\"@+id/a\"\n app:popUpToInclusive=\"true\"/\\\u003e\n \u003c/fragment\u003e"]]