1. 问题的来源
- 在开发中经常需要进行一个页面级联效果,最经常使用莫过于省市级三级联动的效果,比如选完北京市然后把北京市下属的区丰台区,海淀区,昌平区…返回前端
2. 解决方案
本次解决方案仅涉及后端(ps:主要是前后端分离的项目写多,不会前端操作了)
2.1 数据库设计
CREATE TABLE `sys_china` ( `Id` int(11) NOT NULL COMMENT '主键id', `Name` varchar(40) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL COMMENT '名称', `Pid` int(11) NULL DEFAULT NULL, `status` varchar(2) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT '1' COMMENT '1:启用,2:禁用', PRIMARY KEY (`Id`) USING BTREE, INDEX `FK_CHINA_REFERENCE_CHINA`(`Pid`) USING BTREE ) ENGINE = InnoDB CHARACTER SET = utf8 COMMENT = '省市区表' ;
2.2 后端代码(springboot+mysql)
代码地址:
https://github.com/Dr-Water/Level-3-linkage
sql代码也在项目的sql文件夹中
数据库一共四个字段:
列 | 含义 |
id | 主键id |
name | 省市县的名称 |
pid | 本条记录父类id |
status | 本条记录的启用状态 |
2.3 操作测试步骤
将项目启动起来使用postman进行测试:
请求路径:localhost:8010/link/city/queryById
- 前端第一次请求的时候id传成0 先把全国的省和直辖市查出来,
- 拿到省或者直辖市的id再去请求接口这样就能将本省的下的市或者区全查出来
2.4数据的存储以及回显
1.在使用的时候最好将省市县的主键id 和 name都存到数据库中
2. 前端回显的时候可以直接拿name去展示省市县的名称,也可以使用id从数据库中请求
3. 当数据量特别大的时候,如果使用id去请求数据库可能会对数据库造成很大的压力,这个时候可以将所有的省市县全查出来放到redis中,减轻数据库的压力
4. 如果值列表的数据不是很大,可以直接将数据以id为key,name 为value 的大map的形式全给前端, 前端回显的时候使用id去map中去匹配值