怎么在vuerouter中动态路由设置参数可选-创新互联

怎么在vue router中动态路由设置参数可选？很多新手对此不是很清楚，为了帮助大家解决这个难题，下面小编将为大家详细讲解，有这方面需求的人可以来学习下，希望你能有所收获。

成都创新互联是由多位在大型网络公司、广告设计公司的优秀设计人员和策划人员组成的一个具有丰富经验的团队，其中包括网站策划、网页美工、网站程序员、网页设计师、平面广告设计师、网络营销人员及形象策划。承接：网站制作、成都网站建设、网站改版、网页设计制作、网站建设与维护、网络推广、数据库开发,以高性价比制作企业网站、行业门户平台等全方位的服务。

new Router({
  routes: [
    {
      path: '/user/:page/:id',
      name: 'User',
      component: () => import('pages/user')
    },
    {
      path: '*',
      redirect: '/home'
    }
  ]
})

解决方法

参数配置改成可选的

path: '/user/:page?/:id?'

ps：下面看下vue-router 动态添加 路由

   动态添加路由可以用了做权限管理。登录后服务器端返回权限菜单，前端动态添加路由  然后在设置菜单

 1、vue-router 有方法router.addRoutes(routes) 动态添加更多的路由规则。参数必须是一个符合 routes 选项要求的数组。

           使用方法 

this.$router.options.routes[0].children.push({//插入路由
 name:'list',
 path: 'list',
 component: resolve => require(['../template/list.vue'], resolve)//将组件用require引进来
});
this.$router.addRoutes(this.$router.options.routes);//调用addRoutes添加路由

我的路由文件:

export default new Router({
 routes: [
  {
   path: '/',
 
   component: index,
  },
  {
   path: '/login',
   name: 'login',
   component: login
  }
 ]

看完上述内容是否对您有帮助呢？如果还想对相关知识有进一步的了解或阅读更多相关文章，请关注创新互联成都网站设计公司行业资讯频道，感谢您对创新互联成都网站设计公司的支持。

另外有需要云服务器可以了解下创新互联scvps.cn，海内外云服务器15元起步，三天无理由+7*72小时售后在线，公司持有idc许可证，提供“云服务器、裸金属服务器、网站设计器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案，具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势，专为企业上云打造定制，能够满足用户丰富、多元化的应用场景需求。

分享文章：怎么在vuerouter中动态路由设置参数可选-创新互联
转载注明：http://cxhlcq.com/article/dpodgs.html