5.商品分类查询功能_商品品牌分页查询功能

知识点总结

1.功能：查询全部一级分类商品：

分类表：tb_category 字段： id name parent_id(父级分类) is_parent(是否是一级分类) sort(排序指数，越小越靠前)
http://api.leyou.com/api/item/category/list?pid=0
返回 ResponseEntity<List> ResponseEntity包装成json

为什么返回是List？ 因为前端tree组件用法，返回是json数组，对应Java的List集合

2.功能：查询所有品牌，分页显示

品牌表：tb_brand 字段：id name image letter
http://api.leyou.com/api/item/brand/page?key=&page=1&rows=5&sortBy=id&desc=false
返回：ResponseEntity<PageResult>
自己定义了PageResult类，

为什么要自己定义PageResult:？
分页结果一般至少需要两个数据

• total：总条数
• items：当前页数据
• totalPage：有些还需要总页数

所以要自己定义PageResult，
private Long total; // 总条数
private Integer totalPage; // 总页数
private List items; // 当前页数据

3.品牌与分类的关系： 多对多 ，一个分类下有多个品牌，一个品牌也可以属于不同分类

所以还有一张 分类-品牌表 tb_category_brand category_id brand_id

4.跨域问题：

页面所在路径：http://manage.leyou.com
请求路径：http://api.leyou.com/api/item/category/list?pid=0 (前端导致的，前端代码有一个baseUrl: http://api.leyou.com/api, 对所有请求约定)
属于不同的域，无法请求动态资源

跨域原理：
为保护网页，ajax请求分为两类：简单请求、特殊请求。
特殊请求会有一次预检请求，询问服务器当前网页所在域名(Origin中会指出当前请求属于哪个域（协议+域名+端口)是否在许可名单中，以及可以使用哪些HTT动词和头部信息段.

解决办法：CORS
优点： 在服务端进行控制是否允许跨域，可自定义规则，支持各种请求方式
缺点：需要多一次请求
实现：CorsFilter类下添加允许口语访问的http://manage.leyou.com和请求方式，告诉浏览器http://manage.leyou.com在白名单内
拦截一切请求

---

网关代理的是各个微服务
Nginx代理的是网关，

前后端分离后端代码编写

根据需求，页面，页面没写好，就会有接口文档，编写后端代码

一、分类前端页面分析：

有一些静态数据

分类管理的路径：http://manage.leyou.com/#/item/category

在router/index.js中，根据路由"/item/category",找到组件’/item/Category’

自定义全局组件< v-tree > ，由于是全局组件，所以不需要引入

全局组件：
只要是有vue实例的地方就可以使用，category就是vue实例

二 后端代码实现

sql代码

分析tb_category:

三级分类，一般电商网站都是三级分类：

一般先加载一级类目，即找父类pid目为0的类目，
请求方式/路径：Request:URL
请求参数：pid = 0
返回结果集：集合
知道这三个参数，就可以编写后端代码了

编写后端代码

1.编写Category类

@Table(name="tb_category")
public class Category {
   
	@Id
	@GeneratedValue(strategy=GenerationType.IDENTITY)
	private Long id;
	private String name;
	private Long parentId;
	private Boolean isParent; // 注意isParent生成的getter和setter方法需要手动加上Is
	private Integer sort;
	// getter和setter略
}

注意isParent的get和set问题，增加

    public Boolean getIsParent() {
   
        return isParent;
    }

    public void setIsParent(Boolean parent) {
   
        isParent = parent;
    }

2.引入依赖

    <dependencies>
        <dependency>
            <groupId>javax.persistence</groupId>
            <artifactId>persistence-api</artifactId>
            <version>1.0</version>
        </dependency>
    </dependencies>

3.创建Mapper

在引导类引入MapperScan，引入通用Mapper的MapperScan,扫描mapper包，这样mapper包下的Mapper就不用添加mapper注解了

package com.leyou.item.mapper;

import com.leyou.item.pojo.Category;
import tk.mybatis