**嵌套路由**
{
path: '/home',
component: () => import('../views/Home.vue'),
children: [{
path:'',
redirect:'/home/product'
},{
path:'product',
component:()=>import('../views/HomeProduct.vue')
}]
}
页面中的使用
通过点击按钮来跳转
import { useRouter } from "vue-router"
const router = useRouter()
const jumpBtn = () => {
router.push('/product')
}
query方式的参数
const router = useRouter();
const jumpTo = () => {
router.push({
path: "/about",
query: {
name: "fuck",
},
});
};
在界面中通过 $route.query 来获取参数:
{{$route.query}}
页面的前进后退
import { useRouter } from 'vue-router'
const router = useRouter()
<van-icon name="arrow-left" @click="router.back()" />