修改最新版 Vben Admin 通过后端服务器API加载动态菜单

最新推荐文章于 2025-10-08 01:29:07 发布

原创最新推荐文章于 2025-10-08 01:29:07 发布 · 2k 阅读

6 ·

CC 4.0 BY-SA版权

文章标签：

#数学建模

文章讲述了如何在permission.ts文件中添加一个方法，通过调用http://127.0.0.1:8000/menu/get_menu/的API从后端获取菜单数据，然后设置菜单列表。使用axios库处理异步请求，并在捕获错误时进行日志记录。

修改代码：permission.ts

文件位置：D:\chengchen\src\PrototypeCode\vben_client\src\store\modules\permission.ts

代码修改为：

增加动态菜单获取方法：

    // 构建菜单，从后端菜单API获取数据构建菜单
    buildMenusByServer() {
      const menus = axios
        .get('http://127.0.0.1:8000/menu/get_menu/')
        .then((response) => {
          const menuList = response.data;
          return menuList;
        })
        .catch((error) => {
          console.error(error);
        });

      menus.then((menuList) => {
        // 设置菜单列表
        this.setFrontMenuList(menuList);
      });
    },