省市区---异步加载树

最新推荐文章于 2023-05-11 10:13:19 发布
最新推荐文章于 2023-05-11 10:13:19 发布
阅读量1.6k 收藏
点赞数
分类专栏： J2EE 文章标签： 数据库 框架
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Markzwei/article/details/6529845
版权

前几天一直在试图做个异步树，由于项目中需要人员的籍贯信息---省市区，全国的省市区有3千多个结点，同步加载的话，估计很少有插件可以扛得住，也没有找到合适的js插件。试了JsTree，zTree，dTree等，都没有达到要求，前两个是之前没有用过，官方的demo又解决不了问题，dTree一直在用，但只是做菜单，结点数根本不超过100。无法还是用学校网站的那个myTree做了。

 

研究了两个终于算是把学校网站的弹出框选择的树搞定了。心里总算是踏实点了，可以放心看书了。初始加载的是34个省结点，然后点击省市时异步从数据库中加载其子节点，代码中未使用任何的js框架，可见写此树的人真是强悍呐……

 

markzwei
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
专栏目录
c# 省市区集成模块【支持延迟加载异步回调】
05-14
/// 延迟加载 /// Func, IEnumerable<T>> AsyncBack { get; set; } /// /// 传入延迟参数 /// /// <param name="TKey"></param> void SetAsyncBack(Func, IEnumerable<T>> TKey); TSource ...
省市区3级联动数据ant design
09-07
省市区3级联动数据，包含港澳台下的市区，可用于 ant design 下的各个组件库
JS树结构操作:查找、遍历、筛选、树结构和列表结构相互转换
web前端开发
11-24 1415
来源 |https://wintc.top/article/20经常有同学问树结构的相关操作，也写了很多次，在这里总结一下JS树形结构一些操作的实现思路，并给出了简洁易懂的代码实现。本...
vue+elementui 搭建 treeTable实现异步加载，追加子级
八佾舞于庭
10-11 8796
treeTable页面 html部分： &lt;template&gt; &lt;el-table :data="formatData1" :row-style="showRow1" v-bind="$attrs" style="width: 100%;" :height="height"&gt; &lt;el-table-column v-if=&qu
树形ztree 与angularjs结合，实现下级数据异步加载，点击复选框 填写到输入框里...
weixin_33910137的博客
06-15 413
html: <link href="content/script/ztree/zTreeStyle.css" rel="stylesheet" /> <script src="content/script/jquery.min.js"></script> <script src="content/script/ztr...
js异步加载下拉树的实现
yulon
03-05 446
下拉树图示：   主要实现部分： 第一，freemarker页面显示部分 &lt;input type="hidden" name="comboxId" id="comboxId"&gt; &lt;div style="position:relative;float:left;"&gt; &lt;div id="combo" onclick="s
JS 异步加载js的三种方案
qq_45560350的博客
09-09 1552
js文件加载的缺点： 页面的js文件一般是同步加载，加载到js文件会阻断html和css的加载，要等到js文件加载完毕，才能继续向下执行，因为js可能会操作html和css；但有些js文件不会操作html和css，只是进行初始化数据或者引入工具包，我们希望这些js文件能够并行异步地加载，以免一个js文件加载失败，导致后续所有页面都加载不了，影响页面效率。 有些工具方法需要按需加载，用到再加载，不用不加载。 js异步加载的三种方案： 1.defer 只有IE9以下能用 异步加载，但要等到dom文档全部解析完（
jQuery省市区菜单联动特效代码
03-20
jQuery省市区菜单联动代码是一款利用json异步加载省市区地区数据，点击选择省市区菜单选中代码。
jQuery省市区菜单联动代码.zip
07-04
jQuery省市区菜单联动代码是一款利用json异步加载省市区地区数据，点击选择省市区菜单选中代码。
react项目使用了 Ant Design等需要三级联动的省市区资源库
11-26
let cityData = { "RECORDS": [ { "value": 110000, "label": "北京", "children": [{ "value": 110100, "label": "北京", "children": [{ "value": 110101, "label": "东城" ...Ant Design组件三级联动资源...
使用ztree异步加载全国地区。
04-10
本人最近在做区域切换，由于是全国地区的，数据高达60多万条，所有采用异步加载的方式。这是一个ztree异步加载全国地区的代码。controlller是后台,tree.jsp是页面。
动态数据库加载省市区形成树形结构
09-09
这个功能是本人用vs2008+sql2005所做 很值得学习 所以就上传给大家学习
异步&同步加载树节点----zTree(一)
07-26
该资源原理说明与博客《异步&同步加载树节点----zTree(一)》相一致。
异步加载组织结构树以及操作
05-27
NULL 博文链接：https://weizuqing1986-126-com.iteye.com/blog/525847
省市区选择器上拉加载下拉刷新等多个有用微信小程序例子
04-18
微信小程序有用例子，适合初学者练手及公司项目使用
JS 动态树 异步加载树 xloadtree WebFXLoadTree
yhef的专栏
08-21 299
资料地址: [url]http://webfx.eae.net/dhtml/xloadtree/xloadtree.html[/url] 概述: XLoadTree 可以实现异步加载树，主要是通过读取XML数据流，生成嵌套DIV的方式做展现. 如果数据量较小可以使用本组件，建议单层不要超过200个节点数。 其中有好几个对象WebFXTree\WebFXTreeItem\W...
异步加载树结构
weixin_51111241的博客
05-11 355
/当前点击的树节点。//对比前后id，不相同时移除上一个节点的样式，并设置当前点击的节点样式。//当前点击的树节点。//对比前后id，不相同时移除上一个节点的样式，并设置当前点击的节点样式。
异步加载树
geertu
12-21 171
/** * 构建行政区划树 * @author frank *  * @param divId divid * @param divWidth div宽度（例如：【"200px"】。） * @param divHeight div高度（例如：【"400px"】。） * @param loadDeep 区划树深度（例如：加载到盟市为【2】，加载到旗县为【3】，以此类推。） * @param call...
jeecg-异步加载树结构
Think_kill的博客
02-22 872
1.首先前端所需数据结构->核心是 hasChildren 2.使用组件 //异步树结构 import JTreeTable from '@/components/jeecg/JTreeTable' components: { JTreeTable, }, computed: { tableProps() { let _this = this return { // 列表项是否可选择 // 配置项见：https://vue.ant.design/c
element cascarde 动态加载接口省市区地区数据
最新发布
09-05
Element Cascader 是一个支持级联选择的组件，可以通过动态加载接口实现省市区地区数据的选择。 首先，在项目中安装 Element UI 组件库，并在需要使用 Cascader 组件的页面进行引入。 然后，在组件内部定义一个名为 "options" 的数据，用于存储加载后的省市区地区数据。 接下来，通过调用接口获取省市区地区的数据，一般接口会返回一个包含省市区数据的数组。我们可以利用 axios 等网络请求库发送异步请求，在获取到数据后将其赋值给 "options" 数据。 接口获取到的数据一般都是树形结构，每个节点都包含着该节点的子节点。我们可以通过循环遍历这个树形结构，将每个节点转化为 Cascader 组件期望的格式，即 {label: '节点名称', value: '节点值', children: '子节点数组'}。然后将转化后的数据赋值给 "options" 数据，即可动态加载省市区地区数据。 最后，将 Cascader 组件渲染到页面上，并绑定 "options" 数据作为其属性传入，这样就可以实现动态加载接口省市区地区数据。 总之，使用 Element Cascader 组件动态加载接口省市区地区数据，需要安装 Element UI 组件库，定义 "options" 数据存储接口返回的数据，通过网络请求库发送接口请求获取数据，并将树形结构的数据转化为 Cascader 组件期望的格式，最后将数据传递给 Cascader 组件即可实现动态加载。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值