Translation of this issue:

v2.0 Privilege Control

After reading the permission for two days, I still didn't understand it. Usually our permissions are composed of menus and functions. Both of these are returned in the background. The returned permissions are the permissions of the currently logged in user, including menus and functions.

1. The menu is displayed on the left or the top display section
2. Function refers to the elements of the page, including buttons, page display areas, columns of tables, etc.

data structure

    [{
        "id": "1" // permission primary key
        "name":""
        "url":"" //route
        "pId": //parent
        "bpId": //Navigation bread crumbs superior
        "icon":
        "Permission": //Permission ID, which defines an identifier for each element that needs control permission. When the page is rendered, it is judged whether it is displayed according to the identifier and the returned permission.
        "type": // permission classification, 0: menu, 1: function permission
    }]

Use

After returning the data, all types with 0 are converted into menu data, and all the permissions with type 1 are taken out to determine whether the page elements are displayed. All the routes that are not empty are intercepted and judged whether there is permission when the route jumps.

"rightData": [] / / returned data
"menu":[{"id","name","pId","bpId","icon","url","children":[]}]
"permission":["p1","p2"]
"allRoutes":["url1","url2","url3"]//The interception judgment is made when the route jumps, even if the route is guessed, it cannot be accessed.

就目前2.0的情况来看 官方应该是想将ant-design-pro定位为快速上手完成业务开发的中小型后台方案。

菜单的权限完全由前端在开发环境下的配置文件写死（1.x还可以稍作改造使得在初始化时可以先从服务端获取菜单的权限再开始渲染，但在2.0似乎行不通，因为js的初始化入口文件直接被干掉了，变成了自动生成，无法人为干涉初始化过程）。也就是说，按“角色”来控制菜单和路由的权限，且每次修改这方面的权限都需要前端手动调整配置文件，而不准备开发权限编辑页面这样的功能；

而功能的权限则可以通过一个专门的接口将相关数据存放在某个全局性的model中然后通过connect属性注入+条件渲染来实现 @wangtaicheng

v2 也是可以的。将BasicLayout 的 menuData修改为 state 就可以动态切换了。

trace umijs/umi#944

v2 也是可以的。将BasicLayout 的 menuData修改为 state 就可以动态切换了。

具体怎么修改？ 官网文档也就是这么一句，没有详细说明
@chenshuai2144

@chenshuai2144 同问，找了很久都没找到😭

@Nicholasnc 想要控制权限，控制menu model里面的routerData，想要控制菜单，控制menu model里面的menuData。在#3587 这次提交之后，这个问题应该可以很容易的处理了。

我的理解是这样的：

在 src/models/menu.js中：

。。。
export default {
  namespace: 'menu',

  state: {
    menuData: [],
    routerData: [],
    breadcrumbNameMap: {},
  },

  effects: {
    *getMenuData({ payload }, { put }) {
      const { routes, authority } = payload;
      const originalMenuData = memoizeOneFormatter(routes, authority);
      const menuData = filterMenuData(originalMenuData);
      const breadcrumbNameMap = memoizeOneGetBreadcrumbNameMap(originalMenuData);
      yield put({
        type: 'save',
        payload: { menuData, breadcrumbNameMap, routerData: routes },
      });
    },
  },

  reducers: {
    save(state, action) {
      return {
        ...state,
        ...action.payload,
      };
    },
  },
};

那么routerData 和 menuData 是否都取决于 config/router.config.js 里的值？

如果我想用后台的动态权限的话，那么是否只需要在 src/layouts/BasicLayout.js 中的 componentDidMount 函数中请求好数据，根据后台的数据重新组织好一份新的 routes 然后使用原本的方法：

dispatch({
      type: 'menu/getMenuData',
      payload: { routes, authority },
    });

@xiaohuoni 请问以上思路是否正确

嗯，不过请求可以放在model中处理。

请求后端拿到数据后，menuData和routerData都动态产生了，那route.config.js里面可以把动态生成的部分删掉吗？我测试了下，一直跳404，必须route.config.js有这个路由配置才行

要灵活处理，可以考虑试试约定路由。切换到子分支可以参考。

https://github.com/ant-design/ant-design-pro/tree/Conventional-Routing