乐闻技术笔记

【react】全局路由统一拦截处理

设计模式

代理模式


router.js


import Home from '../pages/home'
import Article from '../pages/article'

import User from '../pages/user'
import Role from '../pages/role'

const routers = [
  {
      title: '首页',
      path: '/',
      icon: 'icon-iconset0123',
      component: Home
  },
  {
      title: '笔记',
      path: '/article',
      icon: 'icon-iconset0123',
      component: Article

  },
  {
      title: '权限管理',
      path: '/auth',
      icon: 'icon-lishihistory2',
      children: [
          {
              title: '用户',
              path: '/auth/user',
              icon: 'icon-icon-',
              component: User
          },
          {
              title: '角色',
              path: '/auth/role',
              icon: 'icon-navicon-jsgl',
              component: Role
          }
      ]
  }
];
export default routers;

router.js


class LvxRouter extends React.Component {

  render(){
      return (
          
              
                  
                      
                      
                          
                              
                                  {
                                      Routers.map((item, index)=>{
                                          return  (true ?  :
                                              
                                              )}/>
                                      })
                                  }
                                  {/*  */}
                              
                          
                      }/>
                      
                  
              
          
      );
  }

}
export default LvxRouter;
打赏本文
二维码

9

文章

9

标签

 文章分类