zoukankan      html  css  js  c++  java
  • Vue动态路由

    vue 实现动态路由

    很多时候我们在项目的路由都是在前端配置好的
    但是有的时候为了进行全面的权限控制,会需要后台给出路由表,前端再渲染。不用在前端配置。

    1、沟通好数据

    2、拿到数据需要自己处理

    3、把后台提供的数据处理成我们需要的路由表,可以利用for循环来遍历路由数据

    比如:

    getData(){
            let url=""//请求的地址
            Http.get(url).then((res)=>{
              let arr=res.index//路由列表
              let routes=[]
            for(let i=0;i<arr.length;i++){
              let obj={
                path:"/"+arr[i].url,
                meta:{isshow:false},//meta标签可以根据自身需求动态添加
                component:()=>import("@/views/"+arr[i].url)
              }
              routes.push(obj)
            }
            this.$router.options.routes=routes
            this.$router.addRoutes(routes)//添加路由
          }).catch((err)=>{
            window.console.log(err)
          })
          }

    4、添加到路由中

    Router.addRoutes(路由数据)
  • 相关阅读:
    0806 c#总复习
    0804 递归
    0808 html基础
    0803结构体,枚举类型
    0801out传值
    0731函数
    0730特殊集合
    0728多维数组,ArrayList集合
    js 获取url链接的任意参数
    jq dom操作
  • 原文地址:https://www.cnblogs.com/yeqi/p/13356094.html
Copyright © 2011-2022 走看看