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

省市县三级联动的实现方案相关推荐

jQueryDay04:distpicker省市县三级联动， Layer插件，Laydate插件
目录 0x00 distpicker省市县三级联动如何设置默认值: 如何获取提交的数据: 后台数据回显: 0x01 Layer插件 0x02 Laydate插件 0x00 distpicker省市县 ...
jquery省市县三级联动
Jquery省市县三级联动,数据来源js,无需调用接口可前往本人发布资源<Jquery省市县三级>免积分下载目录效果 html部分 <!DOCTYPE html> < ...
mysql 省市县三级联动查询_省市县三级联动的SQL语句
省市县三级联动的SQL语句无 CREATE TABLE `t_address_province` (`id` INT AUTO_INCREMENT PRIMARY KEY COMMENT '主键', ...
【MySQL】全国省市县三级联动SQL语句—区县SQL(三)
目录 ->区县信息表数据 [MySQL]全国省市县三级联动SQL语句-建表和省份SQL(一)_路遥叶子的博客-CSDN博客全国省市县三级联动SQL语句-建表和省份SQL(一)https://bl ...
mysql 省市县三级联动查询_PHP+AJAX+MYSQL 仿凡客诚品省市县三级联动下拉菜单查询效果...
连接数据库:db.php $dbhost="localhost"; $dbpassword="123"; $dbuser ='root';//数据库用户名 $d ...
JavaScript省市县三级联动-含源代码
目录一.省市县三级联动 1.实现思路 2.实现步骤二.源代码管理 1.HTML显示页面 2.JavaScript核心代码 3.省市县三级地址一.省市县三级联动 1.实现思路 1.创建省市县三级地 ...
php 把省市存入数据库,用JS做了个省市县三级联动效果可存入数据库的值老不对,有代码...
用JS做了个省市县三级联动效果可存入数据库的值老不对,有代码,在线等现在的问题是这样的,当我选好地址后就提交他到数据库中去,可是现在怎么修改提交到数据库中的值都是前面的那些编码,就不是后面的文字.要 ...
JavaScript 省市县三级联动
JavaScript 省市县三级联动 2010-03-16 效果演示省市联动出生地:--请选择省份-- 北京市天津市河北省山西省内蒙古自治区辽宁省吉林省黑龙江省上海市江苏省浙江省安徽省福建省 ...
省市县三级联动插件（面向过程，面向对象两种方式实现）
<div class="city_select"><select id="province"><option value=&quo ...
中国行政区域省市县三级联动json数据（包含港澳台）
中国行政区域省市县三级联动json数据(包含港澳台) 中国省市县json数据,包含港澳台地区详细数据(台湾地区市县同级,市下有区,县级以下没补充乡镇列表,使用的话需要注意下,数据来源国家民政部行政划分 ...

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