三级联动，随着越来越多的审美，出现了很多种，好多公司都仿着淘宝的三级联动 ，好看时尚，so我们公司也一样……为了贴代码方便，我把写在data里面省市区的json独立了出来，下载贴进去即可用，链接如下：vue.json(这个直接是个data，放入你的vue2项目中即可。（因为我的项目是用的vue2，所以，其他的属性跟博客内容是吻合的。请配合博客再下载此json）)。
首先页面显示如下：
然后我们县级所在地区会出现三级联动，如下：（以下是片段，背景色未截取）
这个张什么样，以什么形式出现，取决于贵公司的UI需求，我们公司是做成弹出层了。。然后背景色透明，这里为了节省流量，我只截取了一段，最后
2022-01-19 10:44:06
61KB
1
省市区三级联动JSON格式数据，博文所用，包含是中国目前所有的省市区三级的地名和地名的id,可以灵活组装为省市二级数据，或者省市三级数据，作为选择器的数据来源，也可放在服务端异步加载
2022-01-15 21:07:37
308KB
1
HTML5，这是一款非常实用美观的省市区三级联动城市选择器插件，移动端jQuery省市县城市三级联动下拉菜单选择插件代码。也可以修改为：省市区三级联动、省市二级联动或单选省。
2022-01-14 15:33:25
24KB
1
小程序picker 二级联动。需要的拿走，只为减少弯路。js文件中为了更方便看到效果所以直接把json 贴出来，通过 JSON.parse(json) 转成对象。正常的应该是通过接口返回的，各位做成动态的要把这个代码去掉，拼装成这样就好了。亲测，可用。
wxml中默认的显示的 两个分类名称，第一个给注释掉了，看需求可再修改显示一个分类名称，还是两个分类名称。
20200603修改了个bug。这个方法重写了
bindMultiPickerColumnChange: function (e) {
var that=this;
console.log('修改的列为', e.detail.column, '，值为', e.detail.value);
var data = {
multiArray: this.data.multiArray,
multiIndex: this.data.multiIndex
};
data.multiIndex[e.detail.column] = e.detail.value;
//如果是第0列，那麼第1列则显示
if(e.detail.column == 0)
{
for (let i = 0; i < that.data.allmultiArray[e.detail.value].child.length; i++) {
if (i == 0)
{
that.setData({ 'childcatid': that.data.allmultiArray[e.detail.value].child[i].class_id, "multiArray[1]":[] });
}
that.data.multiArray[1].push(that.data.allmultiArray[e.detail.value].child[i].class_name);
}
}
//如果是第1列
if(e.detail.column == 1)
{
for (let i = 0; i < that.data.allmultiArray[that.data.multiIndex[0]].child.length; i++) {
if (i == e.detail.column)
{
that.setData({ 'childcatid': that.data.allmultiArray[that.data.multiIndex[0]].child[i].class_id });
}
}
}
this.setData(data);
},
2022-01-13 14:53:21
3KB
1
郑州市区街道社区三级联动数据，来源2021年国家统计局数据3428条数据，花了三个时候整理的
2022-01-06 20:05:55
192KB
1