menu nestedrouteitems problem solved

src/components/menu/ConfirmationDemo.vue

@@ -0,0 +1,12 @@
+<template>
+    <div class="flex align-items-center py-5 px-3">
+        <i class="pi pi-fw pi-check mr-2 text-2xl" />
+        <p class="m-0 text-lg">Confirmation Component Content via Child Route</p>
+    </div>
+</template>
+
+<script>
+export default {
+
+}
+</script>

src/components/menu/PaymentDemo.vue

@@ -0,0 +1,12 @@
+<template>
+    <div class="flex align-items-center py-5 px-3">
+        <i class="pi pi-fw pi-money-bill mr-2 text-2xl" />
+        <p class="m-0 text-lg">Payment Component Content via Child Route</p>
+    </div>
+</template>
+
+<script>
+export default {
+
+}
+</script>

src/components/menu/PersonalDemo.vue

@@ -0,0 +1,12 @@
+<template>
+    <div class="flex align-items-center py-5 px-3">
+        <i class="pi pi-fw pi-user mr-2 text-2xl" />
+        <p class="m-0 text-lg">Personal Component Content via Child Route</p>
+    </div>
+</template>
+
+<script>
+export default {
+
+}
+</script>

src/components/menu/SeatDemo.vue

@@ -0,0 +1,12 @@
+<template>
+    <div class="flex align-items-center py-5 px-3">
+        <i class="pi pi-fw pi-ticket mr-2 text-2xl" />
+        <p class="m-0 text-lg">Seat Component Content via Child Route</p>
+    </div>
+</template>
+
+<script>
+export default {
+
+}
+</script>