前端的发展迅速,层出不穷。很多公司的项目,在使用框架很好能解决 UI 与数据状态同步的难题,但随着公司业务发展,数据量的庞大以及数据处理越来越复杂,官方组件也难以解决的同时,就不得不自己重写特定组件
博客地址:https://ainyi.com/23 示例 介绍 实现省市区三级多选联动,可任选一个省级、市级、区级,加入已选框,也可以在已选框中删除对应的区域。 选择对应仓库,自动勾选仓库对应的省,取
数据源就是典型的树形结构的JSON数组数据。实际代码中我封装了一个关于省市区三级数据的js插件,具体使用方法省市区三级行政区划数据JS插件 。今天介绍用APICloud AVM框架封装省市区级联选择弹框。
多级联动下拉菜单是前端常见的效果,省市区三级联动又属于其中最典型的案例。多级联动一般都是与数据相关联的,根据数据来生成和修改联动的下拉菜单。完成一个多级联动效果,有助于增强对数据处理的能力。
注意: provinceAndCityData 是省市二级联动数据(不带“全部”选项) regionData 是省市区三级联动数据(不带“全部”选项) provinceAndCityDataPlus 是省市区三级联动数据(带“全部”选项) regionDataPlus 是省市区三级联动数据(带“全部”选项) “全部” 选项绑定的 value 是空字符串”” CodeToText 是个大对象,属性是区域码,属性值是汉字 用法:CodeToText[‘110000’]输出北京市 TextToCode 是个大对象,属性是汉字,属性值是区域码 用法:TextToCode[‘北京市’].code输出110000, TextToCode[‘北京市’][‘市辖区’].code输出110100, TextToCode [‘北京市’][‘市辖区’][‘朝阳区’].code输出110105
demo环境是SpringBoot+Vue+elementUI,开发工具是idea,有涉及到省市区三级联动选择器,网上查找了下,发现了这款和elementUI相匹配的element-china-area-data,这样的话样式什么的就不用担心会很丑,也不需要调,最主要是还可以直接获取到省市区编码,都不用通过后台接口转换。于是就撸起袖子,满心欢喜的整进来。效果如文末所示。
使用的是饿了么团队的移动端组件库 Mint UI 中的 Picker 组件,官方的文档也是十分的不详细。
GitHub:https://github.com/nzbin/Framework7-CityPicker Demo:https://nzbin.github.io/Framework7-CityPicker/ 前言 最近在做移动端项目的时候遇到了省市区选择的功能。以往做项目时都是省市区分开的下拉框样式。这次希望实现效果图要求的级联选择器。我是 Framework7 框架的忠实粉丝,庆幸的是 Fra
阅读本文大概需要5分钟 有时候,我们挂在服务器上的应用会因为一些特殊情况挂掉,致使项目经理又对我们说:又挂了!赶紧去看看! 于是有了以下脚本,使用shell编写,用于定时检查应用情况,挂掉则重启。 这里以tomcat为例。 根据以下步骤即可实现: 1.创建并编辑脚本 vim test.sh 2.复制以下脚本内容至.sh文件中 #自动检测某个tomcat状态(w精确匹配 v去除某种进程 awk数据处理 print $2 打印第二列) TomcatID=$(ps -ef |grep -w 'apache-t
具体的使用可以参考对应的官方文档或者博客vue+Element UI 实现中国省市区三级联动。
1,由于微信小程序的picker组件只提供单独时间选择器和日期选择器,在实际开发中,我们可能需要同时选择日期和时间,组件不够全面,所以在做日期选择器时,需要注意; 2,解决日期和时间选择器结合的方法,利用多列选择器实现; 3,由于多列选择器的数据采用的是二维数组,所以不能直接实现联动效果,需要对数据判断处理。
都说我们要做模块化设计,而不要做功能化设计 什么是模块化设计,就是可插拔性高,组件化,想要就用,不要用拉倒,直接删除就行 什么是功能化设计,就是一个简单的功能,实现想要的效果,但是不够通用化,别人要用的话需要读懂你的代码,还需要复制黏贴很多代码这样效率不高 今天写了一个省市区三级联动的模块,写完后使用会非常方便,也很灵活 主要使用到的技术:jquery,redis,springMVC,MyBatis(springMVC和MyBatis无所谓,你用struts或者hibernate或者spring data都
引入:省市区三级联动数据 导入外部.sql文件的数据: 从SQLyog选择文件导入并执行SQL语句,导入了三张表(省、市、县区)的数据。 读者需要练习使用省市区数据执行脚本可以打开文末的网盘链接进行下载。
在一些和会员相关的注册系统中,让用户输入省市信息是非常常见的行为,并且一般都是要求做到省市区联动下拉效果,今天就给大家推荐一个 jQuery 插件 CitySelect,通过 JSON 数据实现省市联动效果:
(3)封装回调函数,回调函数success中用$.each循环每一条数据,动态创建option,并将数据添加到option中
这期极乐大叔继续将小程序内各种页面效果实现方法聚合了一下,以便大家能够迅速而方便的使用。 图表类(折线图,统计图) 图表类:折线图,柱状图,K线,分时图 生成二维码 微信小程序条形码、二维码生成模块 微信小程序实用Demo: 小程序内生成image格式qrcode(二维码) 微信小程序使用canvas进行二维码绘制 会员小程序开发总结:条形码二维码 图片预加载 在微信小程序里实现图片预加载组件 让人头痛的小程序之『图片懒加载』终极解决方案 多级联动 微信小程序省市三级联动 微信小程序实用组件:自定义toas
联动列表框,简简单单的五个字,仅仅从字面上看,就可以分出来两个职责: 职责一:列表框 职责二:联动 我们先来看这两个职责,然后再说引申出来的另外两个职责。 职责一,列表框。列表框分为很多种,比如下拉列表框(DropDownList)、列表框(ListBox),还有为了美观用div模拟的,以及RadioBoxList,CheckBoxList等。首先一个问题就是,用哪种列表框,然后是其ID、name等属性的命名规范。然后是列表框是怎么出来的?是写死在body里,还是用js动态创建出来,还是其他的什么方式? 这
这个是一个layui省市区三级联动插件,近来使用layui后台模板框架开发后台系统,要用到省市县/区三级联动,本想从网上找个现成的轮子,然没有自己想要的需求,就自己造了个。
省市区联动下拉效果在WEB应用中使用非常广泛,尤其在一些会员信息系统、电商网站最为常见,开发者一般使用AJAX实现无刷新下拉联动。 本文将讲述利用jQuery插件,通过读取JSON数据,实现无刷新动态下拉省市二(三)级联动效果。
省市区三级联动选择是个很频繁的需求,但是查看了市面上很多插件不是太老不维护就是不满足需求,就试着实现一个 这个功能无任何依赖插件 功能略简单,但能实现需求 核心代码也尽力控制在了60行左右 pca-code.json树型数据来源 Administrative-divisions-of-China 下面只贴了省市区选择的功能,全部代码可参考github area分支
就在支付宝小程序上线当天,就有媒体和个人直接指出支付宝小程序示例部分有抄袭微信小程序的部分代码。支付宝很快发布道歉信承认。
python 中如何做可视化报告?使用 Stream lit?你要把成品分享给别人,还需要自己部署一个 web 服务。否则就要把脚本发给别人。需要别人安装 python 才看到效果?别开玩笑了。
vant weapp的Area省市区选择业务组件提供了一个云开发示例但是没写详细的过程,这里把具体步骤说明一下。方便一下别的同学。
(1)跟以前一样,我们复制一份我们已经初始化好了的test.vue页面重命名为addressEdit.vue页面开始初始化。 关于文件名字规范这里提一句,大家可以参考一下我写的关于vue的命名规范
如果用分词的方法去匹配获取比较麻烦,cpca包提供了便捷的调用函数transform。
全国行政区划检索功能, 由于高德和百度也没有提供一个比较完美的解决方案, 因此使用了腾讯地图iOS SDK内部封装的Web接口来实现. 行政区划共分为三个等级, 省级/市级/区级, 对于北京市和天津市这样的城市, 通常直接认为是省级, 并直接以同样的内容来填充市级. 但是SDK内部并没有提供这样的填充, 因此需要自行再省级里面将其复制到市级。
采用的是地图 API 的第二种方式,跳转新的页面,通过回调路径把地址信息带回来原先页面
v-distpicker 使用说明 下拉菜单选择省市区 第一步: 安装v-distpicker npm install v-distpicker -s 第二步: 在main.js中引入 //
已经有二十多天没有更新自己的博客了,这段时间经历了很多事情,离开了生活了六七年的杭州,从离职再入职,忙的是一塌糊涂。
以下将展示微信小程序之表单组件picker源码官方组件能力,组件样式仅供参考,开发者可根据自身需求定义组件样式,具体属性参数详见小程序开发文档。
通过上一篇文章 基于Vue和Quasar的前端SPA项目实战之表关系(六)的介绍,元数据设计功能全部实现了,本文主要介绍业务数据的crud增删改查功能。
正如标题所提及的,在Excel催化剂上进行中国地图数据可视化,可实现零门槛作图,用户无需掌握任何地图相关知识及编程技术,只需掌握基本的Excel操作,即可瞬间完成自己想要的地图展现效果。
效果图 省市区的Json数据 下载链接 <script src="https://cdn.suoluomei.com/common/js2.0/city-data/city-data.js"
一键城市2.0(ThingMap)是ThingJS平台推出的在线3D城市模型场景快速生成系统,所生成的3D城市模型场景,可用于快速构建网页版3D城市类型的管理应用。支持海量基础三维空间数据在不同尺度下的快速加载、渲染、显示,为智慧城市相关应用和企业提供便捷的三维地图沙盘服务;
地址管理之省市区三级联动菜单 三级联动表单 导入省市区的数据 下载sql语句的文件 在数据库中执行:source 文件路径即可导入 导入成功之后,在数据库中会出现三张表,分别代表省,市,区 创建实体类
递归是指程序调用自身的一种编程技巧,在SQL中也有递归查询。下面我们通过一个省市区的示例来讲解递归查询的用法。
针对AdapterView的拓展使用,Spinner实现省市区的三级联动,具体内容如下
为什么要在Power BI中使用SVG地图?因为这种类型的地图是目前在Power BI中显示数据标签最为便捷的地图形式。
现在老板想让你把这些地址统一格式化为标准的省市区地址格式,并写入到 Excel 中。你应该如何操作?
开发中经常遇到需要将一个二维结构的数据转换为N级嵌套(如多级菜单、省市区嵌套等),一般遇到这种问题我们会借助数据表添加冗余列配合代码,高级点的可以再配合数据库的存储过程,简单粗暴点的是把数据拉回来后代码多次循环处理。下面我们用指针/引用再没有冗余列的情况下仅遍历一次原始数据实现省市区的嵌套输出。
先上Demo啦~~~~~ 或许你已经使用过了相应多的省市区与地图联动,但是这些联动往往是单向的、不可逆。并且这些数据往往都是在线使用的,不能离线使用。下图是一个结合百度地图的省市区与地图联动: 我们可以在这个应用里选择,相应的省市区然后地图会跳转到相应的地图。当我们在地图上漫游的时候,如果没有显示当前的省市区是不是变得很难使用。于是,我们就来创建一个吧: 相关技术栈: Bootstrap,UI显示~~,地球人都知道。 jQuery,Bootstrap依赖。 Requ
在上一篇 表关系管理 中,介绍了订单中一对多、多对一、以及多对多关系,本文主要介绍一对一关系和无限主子表在crudapi系统中的应用。
找到django源码中的change_form.html(django/contrib/admin/templates/admin/)文件,复制到app下templates目录中. 在admin中指定自定义的模板文件change_form_template = 'area.html'
有问题吗,sql没问题,这时候用户A的省市区县信息突然变了(也许是在其他地区买房,户口迁移了),也就是说UserInfo表里的信息变了,那用以上的sql统计用户A以前省市区县的订单信息是不是就会出错了呢?(产品狗说在哪下的订单就属于哪的订单)
省市区域图也可以叫省市轮廓图,就是将每个省份、市区的边界区域变成轮廓展示,只是个大概的轮廓,和真是的地图基本一致,毕竟都是一个个点堆起来的,可能会有很小很小的误差,之前做大屏系统中间那个中国地图的时候,客户千方百计交代清楚,千万要注意有九段线,不然在展会上被别人看到如果连九段线都没有的话会被人骂死,可能在部分早期的数据由于不是很完善所以未必有,后期的最新的地图数据都是有的,包括轮廓图数据。
连接 inner join(内连接) 两个表都存在匹配时,返回行 查询每个学生,每个科目的成绩 select students.sname, subjects.stitle, scores.score
表单联动是前端经常面临的问题,联动实际上是一组表单项和表单项之间的依赖关系的集合。比如经典的“省-市-区”三级联动,就包含了“省”、“市”、“区”三个表单项,以及“市->省”和“区->市”。表单项的依赖关系可以抽象成若干if(省 === '广东省') { 市 in [‘广州市’, ‘深圳市’, ...] }的形式,即“市”依赖于“省”。(被依赖项也可以有多个,比如C依赖于B和A;而依赖项有多个的情况可以拆解为相互独立的依赖关系)
目前从国家统计局官网找到的最新的县及县以上行政区划代码:http://www.stats.gov.cn/tjsj/tjbz/xzqhdm/201608/t20160809_1386477.html 可
领取专属 10元无门槛券
手把手带您无忧上云