mini-treegrid控件怎么懒加载时，默认不展开子节点，只显示以及目录

最新推荐文章于 2024-04-18 17:20:34 发布
最新推荐文章于 2024-04-18 17:20:34 发布
阅读量3.1k 收藏 2
点赞数 2
CC 4.0 BY-SA版权
分类专栏： 小技
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/xmz1193184480/article/details/79352650
本文介绍了如何在使用mini-treegrid控件进行数据懒加载时，设置默认状态为不展开子节点，只显示根目录。通过调整特定属性实现这一效果，以达到更高效的数据呈现。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

有时候需要再表格中展示树，mini-treegrid可以动态懒加载树，但会出现子节点都展开了，如下图


我们想要的效果如下：


代码如下：


这里主要的属性是

expandOnLoad="false"
expandOnLoad的值除了true和false，还可以是0，1，甚至-1，

true是展开，false是不展开

expandOnLoad="0" 是第一层级的节点
1是第二层级,但是会把第一层级的也会展开
依次往下

测试过了,没问题。
这样就可以是否展开子节点了


                

        

    

    
  



    



                



	

		

			

				
					
easyui treeGrid实现树形列表（展开不展开）

				
			

			

				

					weixin_30808253的博客
				

				

					05-11
					
					3125
					
				

			

		

		

			
				
在easyui框架中，当你需要加载树形列表的时候，需要用到treeGrid来实现它。
在table中
　　　　需要将class定义为class="easyui-treegrid" 
　　　　在data-options里面，设置好url，也就是你要查询的后台链接；在给它一个loadFilter事件 loadFilter:questiontype.loadFilter,这时候，在你加载表...

			
		

	



                

            
              



	

		

			

				
					
jquery表格树插件GridTree懒加载版本（开源,含demo）

				
			

			

				

					04-03
				

			

		

		

			
				
支持懒加载，解决了大数据量显示效率的问题；
提供表格树回调接口，方便实现自己的业务；
优化以前表格树代码，并且公开源码。

			
		

	



              


  
              

                


	

		

			

				
					
MiniUI——TreeGrid懒加载

				
			

			

				

					世界中心的专栏
				

				

					12-30
					
					8271
					
				

			

		

		

			
				
首先看，前端treegrid的属性配置：
 <div id="boBaseInfo" class="mini-treegrid" style="width: 100%;height: 600px"
         url="/BoInfoManage/GetBoByBot?bot=地质层位" showtreeicon="true" showcheckbox="true"
         on

			
		

	





	

		

			

				
					
jQuery MiniUI 开发教程 TreeGrid 懒加载（二）

				
			

			

				

					iteye_4698的博客
				

				

					12-13
					
					505
					
				

			

		

		

			
				
[b]TreeGrid：懒加载[/b]
[img]http://www.miniui.com/docs/api/images/treegrid_lazyload.png[/img]

参考示例： [url=http://www.miniui.com/demo/treegrid/lazytree.html]TreeGrid：懒加载 [/url]  

[b]创建代码[/b]

    ...

			
		

	



		

			
		



	

		

			

				
					
html中treegrid不显示根节点,treegrid如何让子节点默认不展开

				
			

			

				

					weixin_33866002的博客
				

				

					06-18
					
					486
					
				

			

		

		

			
				
treegrid怎么让子节点默认不展开需求：内容都是动态生成的。点击父节点后才会展开子节点。上图treegrid代码treeGrid=$('#treeGrid').treegrid({url:'${ctx}/sys/resource/treeGrid',idField:'id',treeField:'name',parentField:'pid',fit:true,fitC...

			
		

	





	

		

			

				
					
miniui.TreeGrid设置子节点默认展开

				
			

			

				

					yangshare的博客
				

				

					05-15
					
					5921
					
				

			

		

		

			
				
实现效果



请求参数（tasks.txt）

[{
    "UID": "1",
    "Name": "项目范围规划",
    "Duration": 8,
    "Start": "2007-01-01T00:00:00",
    "Finish": "2007-01-10T00:00:00",
    &quo

			
		

	





	

		

			

				
					
bootstrap-treeview树节点实现动态加载（懒加载）

				
			

			

				

					12-22
				

			

		

		

			
				
这意味着当用户首次访问树形视图时，只会加载根节点，当用户展开某个节点时，该节点的子节点才会在后台请求数据并动态添加到视图中。这样，即使树结构包含数千个节点，也不会对初始页面加载时间造成太大影响。  实现...

			
		

	





	

		

			

				
					
基于layui的树表格-treeGrid

				
			

			

				

					08-23
				

			

		

		

			
				
 - spread：是否默认展开所有节点，一般设为false，避免一次性加载大量数据。  5. TreeGrid的扩展和优化：  - 自定义样式：可以通过layui的CSS类进行自定义样式调整，以满足不同场景的需求。  - 表头操作：可以添加...

			
		

	





	

		

			

				
					
bootstrap-table-treegrid.js

				
			

			

				

					01-14
				

			

		

		

			
				
bootstrap-table-treegrid.js

			
		

	





	

		

			

				
					
EasyUI的treegrid组件动态加载数据问题的解决办法

				
			

			

				

					12-24
				

			

		

		

			
				
每个元素应包含`id`、`parentId`（对于子节点）以及显示的字段，如`title`。确保服务器返回的数据格式与TreeGrid期望的格式一致。  4. **触发加载**：在调用`loadData`函数时，确保TreeGrid已经初始化并且准备好接收...

			
		

	





	

		

			

				
					
bootstrap-treegrid实现树形表格.zip

				
			

			

				

					07-24
				

			

		

		

			
				
 - 使用Ajax异步加载数据，当用户展开节点时只加载对应层级的数据，提高性能。  - 集成其他Bootstrap插件，如Modal、Dropdown，以增强功能和交互体验。  - 通过CSS样式调整，可以实现不同的视觉效果，如颜色、图标等...

			
		

	





	

		

			

				
					
MVC+EasyUITreeGrid懒加载示例

				
			

			

				

					11-06
				

			

		

		

			
				
MVC+EasyUITreeGrid懒加载示例，主要对EasyUI中TreeGrid组件的使用进行演示。对于正在学此组件的童鞋，不防花个几分钟看一下。本文主要演示：TreeGrid的简单应用、懒加载方法、控件数据格式。

			
		

	





	

		

			

				
					
miniui学习笔记（一）treegrid

				
			

			

				

					weixin_30342209的博客
				

				

					07-09
					
					1113
					
				

			

		

		

			
				
　　首先是创建一个树形表格。主要代码如下：

 1 <div id="treegrid1" class="mini-treegrid" style="width:600px;height:280px;"     
 2     url="../data/tasks.txt" showTreeIcon="true" 
 3     treeColumn="taskname" idFie...

			
		

	





	

		

			

				
					
Ant Design 中 Tree 组件使用 defaultExpandAll 属性后不会展开所有节点是什么原因

					
最新发布

				
			

			

				

					青灯文案的博客
				

				

					04-18
					
					3166
					
				

			

		

		

			
				
本文介绍Ant Design中Tree使用defaultExpandAll属性后不会默认展开所有节点可能产生的两个问题：1、TreeData数据未初始化完成，还未开始渲染，就已经开始展开。2、defaultExpandAll属性无法生效，与expandedKeys属性冲突。

			
		

	





	

		

			

				
					
EasyUI Treegrid 点击文本不折叠/展开，点击图标才折叠/展开

				
			

			

				

					qq_40999938的博客
				

				

					09-01
					
					2079
					
				

			

		

		

			
				

//点击文本不展开/折叠
onClick: function (node) {
    if (self.$("#tt").tree('getSelected').state == 'open') {
        $(this).tree('expand', node.target);
    } else {
        $(this).tree('collapse', node.ta...

			
		

	





	

		

			

				
					
miniui Treegrid的简单实现

				
			

			

				

					weisian的博客
				

				

					12-05
					
					6868
					
				

			

		

		

			
				
前台jsp:



    pageEncoding="UTF-8"%>



 PagerTree 树形分页表格
    
   






  CellEdit 单元格编辑
    

    url="menu.do" showTreeIcon="true" 
    treeColumn="taskname" idField="uid" pare

			
		

	





	

		

			

				
					
jQuery MiniUI 开发教程 TreeGrid 创建TreeGrid（一）

				
			

			

				

					iteye_4698的博客
				

				

					12-12
					
					709
					
				

			

		

		

			
				
[b]TreeGrid[/b]
[img]http://www.miniui.com/docs/api/images/treegrid.gif[/img]

参考示例： [url=http://www.miniui.com/demo/treegrid/treegrid.html]TreeGrid[/url]   

[b]创建TreeGrid[/b]

    
        
...

			
		

	





	

		

			

				
					
easyUI中treegrid默认是关闭状态

				
			

			

				

					wazk2008的博客
				

				

					11-22
					
					5048
					
				

			

		

		

			
				
我们在用treegrid时，默认的表格是自动展开的，但是我们很多时候都是想让它打开后是关闭状态。例

打开



关闭：代码：在treegrid属性中添加一下属性：

onLoadSuccess: function(){ $('#treegrid-album').treegrid("collapseAll"); }...

			
		

	





	

		

			

				
					
普元EOS中tree（mini.Tree）

				
			

			

				

					weixin_30505485的博客
				

				

					01-04
					
					248
					
				

			

		

		

			
				
Extend
mini.DataGrid

Usage
<ul id="tree1" class="mini-tree" url="../data/tree.txt" style="width:300px;padding:5px;" 
    showTreeIcon="true" textField="text" idField="id" >        
<...

			
		

	





	

		

			

				
					
全面解析TreeGrid控件及演示源码

				
			

			

				

					
				

			

		

		

			
				
 - Select：在TreeGrid控件中，当用户选择某个节点时触发。  - Expend/Collaspe：节点展开（Expend）和折叠（Collaspe）时触发的事件。  - RowCreate：在行创建时触发。  - RowDataBound：在行绑定到数据时触发。  -...

			
		

	



              




          




        



    





    



      

      

        
      

      





	

		评论	
	

  
	




  

    

      添加红包
      
    

    

      

        
        

          
          
        

        
请填写红包祝福语或标题

      

      

        
        

          
          个
        

        
红包个数最小为10个

      

      

        
        

          
          元
        

        
红包金额最低5元

      

      

        
        

          当前余额3.43元
          前往充值 >
        

      

      

        

          需支付：10.00元
        

        
        
      

    

  





  

    
    
  

  

    
    
  








  

    

      

        

          

            
            
成就一亿技术人!

          

          

        

        

          

          

            领取后你会自动成为博主和红包主的粉丝
            规则
          

        

      

      

        

          

            
              
            
            

              
hope_wisdom
 发出的红包
            

          

        

        

          

          

          

        

      

    

    

  



      
      

      
实付元

      
使用余额支付

      

        

          

            
            点击重新获取
          

        

        
扫码支付

      

      

        
          
            
          
          
        
      

      

        
        钱包余额
          0
          

            
            

              

                
抵扣说明：

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

              

            

          

      

      余额充值