添加动态路由命令,添加路由命令详解

首页 > 实用技巧 > 作者:YD1662023-06-27 02:40:45

在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()方法来支持动态路由渲染。

栏目热文

文档排行

本站推荐

Copyright © 2018 - 2021 www.yd166.com., All Rights Reserved.