谷粒商城项目实现三级分类

1、数据库：首先保证数据库中有父类标签字段(可以为空，一级分类没有父类标签)

2、entity：因为要实现分类 因此在要实现分类的entity中添加一个子类集合 （list<entity> children）,因为不是数据库中的字段因此要添加@TableField(exist=false)注解

3、编写三级分类service：

 public List<CategoryEntity> listWithTree() {
        //1、获取所有数据
        List<CategoryEntity> entities = baseMapper.selectList(null);

        //2、组装成父子的树形结构

        //2.1）、使用父标签找到所有的一级分类
        List<CategoryEntity> level1Menus = entities.stream().filter(categoryEntity ->
             categoryEntity.getParentCid() == 0
        ).map((menu)->{
            menu.setChildren(getChildrens(menu,entities));
            return menu;
        }).sorted((menu1,menu2)->{
            return (menu1.getSort()==null?0:menu1.getSort()) - (menu2.getSort()==null?0:menu2.getSort());
        }).collect(Collectors.toList());




        return level1Menus;
    }

    //递归查找所有菜单的子菜单（因为有三级分类，因此一个子分类下面可能还有其他分类）
    private List<CategoryEntity> getChildrens(CategoryEntity root,List<CategoryEntity> all){

        List<CategoryEntity> children = all.stream().filter(categoryEntity -> {
            return categoryEntity.getParentCid() == root.getCatId();
        }).map(categoryEntity -> {
            //1、找到子菜单
            categoryEntity.setChildren(getChildrens(categoryEntity,all));
            return categoryEntity;
        }).sorted((menu1,menu2)->{
            //2、菜单的排序
            return (menu1.getSort()==null?0:menu1.getSort()) - (menu2.getSort()==null?0:menu2.getSort());
        }).collect(Collectors.toList());

        return children;
    }

4、配置网关路由与路径重写

（1）创建可以用来展示三级分类的界面：在人人fast菜单管理创建新目录和菜单并绑定好要路由的网址；

（2）在人人fast src/views/moudles 路径下创建vue模型用来展示三级分类（使用element-ui模块）

（3）created绑定发送请求数据方法（'/product/category/list/tree'），在vue被创建是直接调用方法；

默认请求数据路径：'http://localhost:8080/renren-fast';但是我们数据服务器在10000端口因此需要更改请求路径，为避免不同服务都需要改地址，我们将请求统一发送到网关，进行统一处理。

 （4）将网关配置到nacos中心，并设置路由匹配规则

此时由于两者端口号不同，服务器默认不支持跨域请求，因此需要进行配置解决

     方案1：使用nginx布置为同一域

     方案2：配置当次请求允许跨域：因为所有请求都要通过网关来转发，因此我们可以在网关配置相关filter（corsWebFilter）（去掉人人-fast 配置的跨域请求）

 （5）登录进来后，点击分类请求，http://localhost:88/api/product/category/list/tree  由于之前我们只配置了api开头的路由到renren-fast模块，但是此时应该到product服务器，此时我们需要配置以/api/product开头的路由规则[先配置优先级越高，因此需要将product配置提前]

        - id: product_route
          uri: lb://gulimall-product
          predicates:
            - Path=/api/product/**
          filters:
            - RewritePath=/api/(?<segment>.*),/$\{segment}       



         - id: admin_route
          uri: lb://renren-fast
          predicates:
            - Path=/api/**
          filters:
            - RewritePath=/api/(?<segment>/?.*),/renren-fast/$\{segment}

  ## 前端项目，/api
## http://localhost:88/api/captcha.jpg   默认为http://renren-fast/api/cptcha.jpg
#  需要变成这样才能正常访问http://localhost:8080/renren-fast/captcha.jpg
## http://localhost:88/api/product/category/list/tree http://localhost:10000/product/category/list/tree

(6)获取数据并，放入到模板中

data() {
      return {
        menus: [],
        defaultProps: {
          children: 'children',
          label: 'name'
        }
      };
    },

 children:指定子树为节点对象的属性值（子分类的属性）
lable：指定节点标签为节点对象的属性值（显示的值）