chore: plaground transparent wrapper

diff --git a/playground/main.ts b/playground/main.ts
index defbc8f753cd3cc2b19831b42d06c54ef4a1b2f5..0fca869cc795c7c841cf6b220581799bd5b8b253 100644 (file)
--- a/playground/main.ts
+++ b/playground/main.ts
@@ -1,6 +1,6 @@
 // necessary for webpack
 ///<reference path="../src/global.d.ts"/>
-import { createApp, App as Application } from 'vue'
+import { createApp, ComponentPublicInstance } from 'vue'
 import { router, routerHistory } from './router'
 import { globalState } from './store'
 import App from './App.vue'
@@ -10,7 +10,8 @@ declare global {
     // h: HTML5History
     h: typeof routerHistory
     r: typeof router
-    vm: ReturnType<Application['mount']>
+    // @ts-expect-error
+    vm: ComponentPublicInstance
   }
 }
 
@@ -19,6 +20,12 @@ window.h = routerHistory
 window.r = router
 
 const app = createApp(App)
+app.mixin({
+  beforeRouteEnter() {
+    console.log('mixin enter')
+  },
+})
+
 app.provide('state', globalState)
 app.use(router)
 

diff --git a/playground/router.ts b/playground/router.ts
index a98dddce0fade07fe1bc3d2db44f0dc11ec8ab1a..cab05b8eb77a79211a6d6839dcbda300bc86063f 100644 (file)
--- a/playground/router.ts
+++ b/playground/router.ts
@@ -1,4 +1,4 @@
-import { createRouter, createWebHistory } from '../src'
+import { createRouter, createWebHistory, RouterView } from '../src'
 import Home from './views/Home.vue'
 import Nested from './views/Nested.vue'
 import NestedWithId from './views/NestedWithId.vue'
@@ -15,8 +15,12 @@ import ComponentWithData from './views/ComponentWithData.vue'
 import { globalState } from './store'
 import { scrollWaiter } from './scrollWaiter'
 import RepeatedParams from './views/RepeatedParams.vue'
+import { FunctionalComponent, h } from 'vue'
 let removeRoute: (() => void) | undefined
 
+const TransparentWrapper: FunctionalComponent = () => h(RouterView)
+TransparentWrapper.displayName = 'NestedView'
+
 export const routerHistory = createWebHistory()
 export const router = createRouter({
   history: routerHistory,
@@ -147,6 +151,16 @@ export const router = createRouter({
         } else next()
       },
     },
+
+    {
+      path: '/admin',
+      component: TransparentWrapper,
+      children: [
+        { path: '', component },
+        { path: 'dashboard', component },
+        { path: 'settings', component },
+      ],
+    },
   ],
   async scrollBehavior(to, from, savedPosition) {
     await scrollWaiter.wait()

diff --git a/playground/views/Generic.vue b/playground/views/Generic.vue
index 8079c805e47af09e98e3cb2d9cffc82b6d954e44..4dd18afb5d29068a35df6783cecc8641d8c479ce 100644 (file)
--- a/playground/views/Generic.vue
+++ b/playground/views/Generic.vue
@@ -1,5 +1,8 @@
 <template>
-  <div>Generic view</div>
+  <section>
+    <h1>Generic view</h1>
+    <pre>{{ $route.fullPath }}</pre>
+  </section>
 </template>
 
 <script>