I'm trying to open a propriete page with a specific id by clicking on a button and displaying the new component's folder, but the contntent is empty and I'm receiving a warning which says " No match found for location with path "/aircraftsForm/1""
//routes
const routes = [
{
path: '/',
component: () => import('layouts/MainLayout.vue'),
children: [
{
path: '',
component: () => import('pages/IndexPage.vue'),
children: [
{
path: 'detailsForm',
component: () => import('../views/DetailsFormView.vue')
},
{
path: 'aircraftsForm',
component: () => import('../views/AircraftsFormView.vue'),
children: [
{
path: 'aircraftsForm/:id',
component: () => import('../components/AircraftComponent.vue'),
props: true
},
]
},
]
}
]
}
]
//Parent view component
const details = ref([
{
id: 1,
tail: '501'
},
{
id: 2,
tail: '501'
}
])
<template>
<form>
<AircraftsFormComponent :details="details"/>
</form>
</template>
// Child component
<router-link
:to="{
path: `aircraftsForm/${props.row.id}`,
params: test
}" >
<q-btn color="primary" label="Edit" />
</router-link>
// child component to render on router link
<template>
<div>
<p>{{id}}</p>
<p>tail</p>
</div>
</template>
I'm expecting to see the content of the child component to be rendered after linking to the router link tag