省市县三级联动的实现方案

最新推荐文章于 2021-02-24 03:54:20 发布

原创最新推荐文章于 2021-02-24 03:54:20 发布 · 3.3k 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#省市县三级联动

实战问题专栏收录该内容

61 篇文章

订阅专栏

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中去匹配值