Nesting, jumping and value passing of vue3 routing

**嵌套路由**
 {
    
    
        path: '/home',
        component: () => import('../views/Home.vue'),
        children: [{
    
    
            path:'',
            redirect:'/home/product'
        },{
    
    
            path:'product',
            component:()=>import('../views/HomeProduct.vue')
        }]
    }

Use in the page

Jump by clicking the button

import {
    
     useRouter } from "vue-router"
const router = useRouter()
const jumpBtn = () => {
    
    
	  router.push('/product')
}

Parameters of the query method

    const router = useRouter();
    const jumpTo = () => {
    
    
      router.push({
    
    
        path: "/about",
        query: {
    
    
          name: "fuck",
        },
      });
    };

Get parameters through $route.query in the interface:

 {
    
    {
    
    $route.query}}

Page forward and backward

import {
    
     useRouter } from 'vue-router'
const router = useRouter()

<van-icon name="arrow-left" @click="router.back()" />