在Vue3.2中,可以使用router.addRoute()和router.removeRoute()方法来动态管理路由渲染。
下面是一个简单的示例,展示如何动态添加路由:
import { createRouter, createWebHistory } from 'vue-router'
// 创建路由实例
const router = createRouter({
history: createWebHistory(),
routes: []
})
// 动态添加路由
router.addRoute({
path: '/dynamic-route',
component: () => import('./DynamicRoute.vue')
})
在这个示例中,我们先创建一个空的路由实例。然后使用router.addRoute()方法来动态添加名为/dynamic-route的路由,它的组件是DynamicRoute.vue。
使用router.removeRoute()方法来动态删除路由同样也是一个可行的解决方案。
注意: 在Vue3.2中,router.addRoutes()方法已经被弃用,改用router.addRoute()方法来支持动态路由渲染。