https://www.npmjs.com/package/element-china-area-data npm文档地址 ...
先上图 具体实现 HTML CSS ps:代码不能直接用,只写了大概,看得懂就行 总体结构 因为省市区三级结构一样,所以可以单独封装一个组件并复用,同时绝对定位出两条分割线,区别选中与非选中的状态,最终的结构如下: 接下来的代码都是在组件中完成 列表可视高度和显示的省市区个数根据具体需求来做修改,这里设置 flex高度为 px line height为 px 即每列显示 个 为了区别选中与非选中状 ...
2019-08-05 16:43 0 1470 推荐指数:
https://www.npmjs.com/package/element-china-area-data npm文档地址 ...
首先呈现效果图 1.我的是通过element-ui实现的;可自由选择UI 2.话不多说,直接上代码,结构非常简单 3.js部分(重点部分是实现字段的重重过滤) 4.城市数据代码格式 { value: 1, label ...
npm 安装 npm install v-distpicker --save Vue全局引入组件 import Distpicker from 'v-distpicker' Vue.component('v-distpicker ...
最近项目中需要用到省市区联动,ui用的是有赞的Vant-UI 看了一下文档,UI中已经给我们提供了一个写好的省市区联动组件,如果没有特殊需求的话可以直接使用: 但是这个组件的架构和项目中的需求有一些出入——项目中所需的行政区标识code使用的不是标准行政区六位代码,是自定义的标识,需要从后台请求 ...
如果下面没有帮助到你请链接:http://blog.csdn.net/xuanzhangran/article/details/55049198 查询的实现的效果如下: (1):点击选择省份,弹出省份列表。 (2):点击内蒙古,第二个联动默认为呼和浩特,同样点击呼和浩特,下边出现所有的内蒙的城市 ...
省市区三级联动(封装了一个js文件) 1.针对region(区域)模块,针对区域的查询和区域添加用到了省市区三级联动 a.regionList.jsp b.regionAdd.jsp 2.公用的省市区三级联动 ...
仿照小米之家做的一个省市区三级联动,先上代码: HTML: JS: CSS: 逻辑分析:首先调用接口,获取省市区数据,然后对省市区数据进行拆分。 具体分析,后面更新 这个是调用接口返回的数据其中一些,具体的参数还可以根据需求再添加。 ...
://files.cnblogs.com/files/nanstar/省市区三级联动数据.zip 这是新的省市区文件,相比较 ...