may21

递归渲染侧边栏

  const renderNavItem = (item: NavItem) => {
    if (item?.children?.length !== 0) {
      return (
        <SubNav key={item?.key} label={text(item)} selectable>
          {item.children.map(ele => {
            return renderNavItem(ele);
          })}
        </SubNav>
      );
    }

    return <Item key={item?.key}>{text(item)}</Item>;
  };

  {menuTreeList.map(ele => {
    return renderNavItem(ele);
  })}

递归查找id并组合其所属所有上层路径数组

  const findUrlPath = useCallback((list?: any[], key?: string, chooseList: any[] = []): any[] => {
    for (const ele of list || []) {
      if (ele?.id == key) {
        return [...chooseList, ele];
      } else if (ele?.children) {
        const result = findUrlPath(ele.children, key, [...chooseList, ele]);
        if (result.length > 0) {
          return result;
        }
      }
    }
    return [];
  }, [])
  const pathUrl = useMemo(() => findUrlPath(context?.config?.menus, pageId), [context?.config?.menus, pageId, findUrlPath])

关于样式

之前一直比较轻视样式

在最近的工作以及面试当中，

体会到样式的重要性，

熟练的样式，

同样可以节省很多查找和试错的时间，

因此学好样式是必要的！

工作总结

不能因为对自己的代码太自信、因为需求简单，

写完就不去验证，

导致了一些细小的样式上、判断上的失误，

因此写完一定要验证！