Estoy tratando de configurar el enrutador en mi aplicación Vue. Todo parecía funcionar bien hasta que comencé a intentar implementar rutas para niños. Ahora, cuando intento acceder a la ruta secundaria, aparece un mensaje de error junto con algunas advertencias: ¿Qué sucede cuando hago clic en el enlace del enrutador secundario?

Configuración de mi enrutador:

 const router = createRouter({ history: createWebHistory(), routes: [ { path: '/', redirect: '/welcome' }, { name: 'welcome', path: '/welcome', component: WelcomePage }, { name:'noteLists', path: '/noteLists', component: NoteListLinks, children: [ { name:'noteListSheets', path: ':id', components: FullNoteSheet } ] } ], linkActiveClass: 'active'

});

Todos los demás enlaces de ruta funcionan bien.

La plantilla de componentes donde se usan y representan los enlaces secundarios se ve así:

 <template> <router-link :to="setNoteListLink(entry.id)" :key=entry.id v-for="entry in notesListEntry" > {{entry.name}} </router-link> <router-view></router-view>

La función setNoteListLink solo crea enlaces como '/noteList/1'.

El error dice que "No se puede leer la propiedad 'writeDebug' de undefined" y writeDebug es un método en un componente que intenta cargar cuando hago clic en la ruta (FullNoteSheet), así que asumo que hay algún problema con el componente y no el enrutador Pero el componente funciona bien si trato de cargarlo por separado, simplemente colocándolo en la plantilla del componente de la aplicación.

Si ha lidiado con estos problemas y conoce la solución, hágamelo saber.