左侧树加载

最新推荐文章于 2023-04-11 02:58:07 发布

weixin_45650011

最新推荐文章于 2023-04-11 02:58:07 发布

阅读量455

点赞数

文章标签：前端 jquery javascript

本文链接：https://blog.csdn.net/weixin_45650011/article/details/121899652

版权

本文介绍了如何在前端实现左侧树形菜单的加载，包括页面布局、节点属性设置、通过AJAX获取后台数据以及JSON数据的拼接。在页面加载完成后，还添加了点击树节点触发对应数据展示的事件处理代码。

摘要由CSDN通过智能技术生成

最近做一个左侧树加载：
首先在页面上的布局，页面要分为左右两块，左侧是菜单，也就是树，右侧是列表，也就是展示数据的地方：
前端页面：

//加载左侧树
<div id="orgTreemanu" class="ztree"></div>
//右侧展示数据的地方，即列表展示范围
<div></div>

这里主要说一下左侧树的加载：
首先是节点属性：

//增加节点属性
        orgTreeOptions={
        //点击事件
            "callback":{
            	"onClick":onLeftClick
        	    },
            "view": {
        	    "nameIsHTML": true,
        	    "showTitle": false,
        		"showIcon": false,
        		"showLine":false,
        		//节点字体大小
        		"fontCss":{
        			"font-size":'20px'
        		}
        	},
        	"data": {
				"simpleData": {
					"enable": true
				}
			}
        }

然后是获取数据(通过ajax从后台获取数据）