OK，马上学到那个课程了，谢谢

么有我想要了解的 splitChunks 相关的。 ：）

Vim 默认不是这样的？没有用过，那是大神用的，哈哈

感谢 ：）

随风大哥，想咨询一下，：），就是你录屏的时候，默认屏幕是放大了的，随着你输入超出屏幕的时候，屏幕会缩小一下，是软件实现的还是 mac 自带的呢，我用 macOS 好几年了，只知道放大镜一样的功能，但是没有一个像你这个效果那么舒服的。可以告知一下不呢

menu.js 这边也有一个逻辑

  effects: {
    *getMenuData({ payload }, { put, select }) {
      const { routes, authority } = payload;

      const menuData = filterMenuData(memoizeOneFormatter(routes, authority));

      // console.info(JSON.stringify(menuData,null,'\t'));
      /** 获取系统权限列表 */
      yield put.resolve({
        type: 'sysUser/sysUserPolicy',
      });
      const policyList = yield select(state => state.sysUser.policy);
      /**
       * {
            "permCode": "sys_module",
            "actions": [
              {
                "text": "输入",
                "value": 1,
                "key": "ADD"
              }
            ],
            "permValue": 1
          },
       */
      const policy = new Policy();
      policy.initPolicy(policyList);

      // // 过滤没权限的菜单
      // menuData.map((item, index) => {
      //   if (typeof item.children !== 'undefined') {
      //     let len = 0;
      //     item.children.map((sub, i) => {
      //       if (typeof sub.policy !== 'undefined' && policy.viewVerify(sub.policy) !== true) {
      //         menuData[index].children[i].hideInMenu = true;
      //       } else {
      //         len++;
      //       }
      //       return sub;
      //     });
      //     // 如果子菜单全部隐藏了，那么主菜单也隐藏
      //     if (len === 0) {
      //       menuData[index].hideInMenu = true;
      //     }
      //   }
      //   return item;
      // });
      const breadcrumbNameMap = memoizeOneGetBreadcrumbNameMap(menuData);
      yield put({
        type: 'save',
        payload: { menuData, breadcrumbNameMap, routerData: routes },
      });
    },
  },

import RenderAuthorized from 'ant-design-pro/lib/Authorized';
import { Alert } from 'antd';

const Authorized = RenderAuthorized('user');
const noMatch = <Alert message="No permission." type="error" showIcon />;

const havePermission = () => {
  return false;
};

// 主要是这里 
ReactDOM.render(
  <Authorized authority={havePermission} noMatch={noMatch}>
    <Alert
      message="Use Function as a parameter passed!"
      type="success"
      showIcon
    />
  </Authorized>,
  mountNode,
);

import CheckPermissions from './CheckPermissions';

const Authorized = ({ children, authority, noMatch = null }) => {
  const childrenRender = typeof children === 'undefined' ? null : children;
  return CheckPermissions(authority, childrenRender, noMatch);
};

export default Authorized;



import React from 'react';
import PromiseRender from './PromiseRender';
import Policy from '@/utils/policy';

import { CURRENT } from './renderAuthorize';
import { devPerm } from '@/utils/authority';

function isPromise(obj) {
  return (
    !!obj &&
    (typeof obj === 'object' || typeof obj === 'function') &&
    typeof obj.then === 'function'
  );
}

/**
 * 通用权限检查方法
 * Common check permissions method
 * @param { 权限判定 Permission judgment type string |array | Promise | Function } authority  sys_module/VIE
 * @param { 你的权限 Your permission description  type:string} currentAuthority 系统localStorage中policy值，每次请求菜单都会更新
 * @param { 通过的组件 Passing components } target
 * @param { 未通过的组件 no pass components } Exception
 */
const checkPermissions = (authority, currentPolicy, target, Exception) => {
  // 没有判定权限.默认查看所有
  // Retirement authority, return target;
  if (authority === undefined || (devPerm())) {
    return target;
  }
  const policyInstance = new Policy();
  policyInstance.initPolicy(currentPolicy);
  // 数组处理
  if (Array.isArray(authority)) {
    if (authority.some(item => policyInstance.verify(item))) {
      return target;
    }
    return Exception;
  }

  // string 处理
  if (typeof authority === 'string') {
    if (policyInstance.verify(authority)) {
      return target;
    }
    return Exception;
  }

  // Promise 处理
  if (isPromise(authority)) {
    return <PromiseRender ok={target} error={Exception} promise={authority} />;
  }

  // Function 处理
  if (typeof authority === 'function') {
    try {
      const bool = authority(currentPolicy);
      // 函数执行后返回值是 Promise
      if (isPromise(bool)) {
        return <PromiseRender ok={target} error={Exception} promise={bool} />;
      }
      if (bool) {
        return target;
      }
      return Exception;
    } catch (error) {
      throw error;
    }
  }
  throw new Error('unsupported parameters');
};

export { checkPermissions };

const check = (authority, target, Exception) => checkPermissions(authority, CURRENT, target, Exception);

export default check;

这个部分代码，思路已经在里面了。其实就是构造一个权限数，可以在服务器拿，也可以在本地弄一个简单的。然后每个授权组件都要用 HOC 包裹一下就可以了。HOC 中做权限检验逻辑做对应的处理就好，这个是以前 Antd 给的方案，

我记得 AntdPro 以前是有例子的，就是一个高阶就可以做到了啊。要显示按钮的地方，你高阶包含一下就可以了啊

我的做法是服务端给授权树，然后在 menu 那边做过滤就应该可以了，然后还有一个 Authrized 的 HOC

对丫，对丫 ：）