ant design pro項目配置路由菜單

有兩種菜單格式，一種是就只有一層，一種是有多層的

一、單層的菜單

 

 首先在pages目錄下新建一個文件目錄

 

 然后在config.js中進行配置

 

 

{
    name: 'new_test',
    icon: 'table',
    path: '/new_test',
    component: './TestRoute/test_route',
}

最后在src\locales\zh-CN\menu.js中配置菜單

 

 

//測試單層菜單路由
  'menu.new_test':'測試單層菜單配置',

二、多層菜單

 

 首先也是在pages目錄下新增目錄文件

 

  然后在config.js中進行配置

 

{
    path: '/test',
    icon: 'setting',
    name: 'test',
    routes: [
        {
             name: 'button_page',
             path: 'button_page',
             component: './ButtonPages/button_page',
         },
     ],
}

最后在src\locales\zh-CN\menu.js中配置菜單

 

 

//多層菜單
  'menu.test': '測試練習',
  'menu.test.button_page': '按鈕頁面',

以上都是簡單的測試，不涉及后台請求動態創建菜單