📒 笔记文档

{
    path:'/pm',
    component:PersonManage,
    children:[
          {
               path:'/pmcontent',
               component:PmContent
     	  }
     ]
}

路由传参

query

<RouterLink :to="`/pm/content?name=${item.name}&id=${item.id}`">{{item.name}}</RouterLink>
//或者
<RouterLink :to="{name:'PmContent',query:{name:item.name,id:item.id}}">{{item.name}}</RouterLink>

<script setup lang="ts">
    import { useRoute } from 'vue-router';
    let route = useRoute();
    let name = route.query.name
</script>

params

<RouterLink :to="`/pm/content/1/test`">{{item.name}}</RouterLink>

需要在路由器中的路由规则中配置

{
    path:'/pm',
    component:PersonManage,
    children:[
        {
            path:'content/:id/:name',
            component:PmContent
        }
    ]
}

<script setup lang="ts">
    import { useRoute } from 'vue-router';
    const route = useRoute();
</script>