grid = $("#datagrid").treegrid({ url:'${ctx}/ajj/risk/riskPoint/getTreeList.haze', lines: false, idField:'id', treeField:'name', fit:true, rownumbers: false, pagination : false, nowrap:true, animate:true, fitColumns:true, singleSelect:true, onBeforeLoad:function(row,param){ if(param.id != null){ param.parentId = param.id; param.id = null; } }, onBeforeExpand:function (row) { var num = 0; row.children; if(row.children.length > 0){ for(var i = 0; i < row.children.length; i++){ var r = row.children[i]; if(r.dangerSourceNum != null && r.dangerSourceNum != ""){ num += parseInt(r.dangerSourceNum); } } row.dangerSourceNum = num; $('[node-id='+row.id+']').find('[field="dangerSourceNum"]').find('div').find('span').remove(); var val='<span style="background-color: #47a447;padding:3px 1px 3px 1px;display:inline-block;text-align:center;border-radius:4px;width:80px;line-height:18px;"><font color="white">已辨识('+num+')</font></span>'; $('[node-id='+row.id+']').find('[field="dangerSourceNum"]').find('div').append(val); } // mergeCell(row, "name");//传入row和列的名称 // mergeCell_1(row, "name", "orgName");//传入row和列的名称 // mergeCell_1(row, "name", "riskGrade");//传入row和列的名称 //mergeCell(row, "gridOp");//传入row和列的名称 //mergeCell_1(row, "name", "gridOp");//传入row和列的名称 return true; }, onLoadSuccess:function(row, data){ removeTreeIcon(); $.each(data, function(i, val) { $("#datagrid").treegrid("expandAll", data[i].id); }); $.each(data, function(i, val) { $("#datagrid").treegrid("collapseAll", data[i].id); }); }, queryParams:{ name:name, orgId:orgId, typeId:typeId, riskGrade:riskGrade } }); 如何提高这串代码的加载效率
时间: 2024-04-27 13:23:34 浏览: 11
以下是一些可能提高这段代码加载效率的建议:
1. 尽量减少 DOM 操作次数:在代码中多次执行类似 `$("#datagrid").treegrid("expandAll", data[i].id);` 的操作,可能会导致性能问题。为了提高代码加载效率,可以尝试使用一次性的 `$("#datagrid")` 选择器来代替多次选择操作。
2. 避免不必要的操作:在 `onLoadSuccess` 事件中,执行了两次 `$.each(data, function(i, val) { $("#datagrid").treegrid("expandAll", data[i].id); });` 和 `$.each(data, function(i, val) { $("#datagrid").treegrid("collapseAll", data[i].id); });` 操作。如果您的数据集很大,这些操作可能会大大降低代码的加载效率。可以考虑只执行一次这些操作,或者在需要时再执行。
3. 减少请求次数:如果您的数据集很大,可以考虑分页加载数据。在 `pagination` 选项中设置为 `true`,并使用 `pageSize` 和 `pageNumber` 选项来控制每页显示的行数和当前页码。这样可以在加载数据时减少请求次数,从而提高代码加载效率。
4. 优化后台接口:如果您的数据集很大,还可以考虑优化后端接口,以提高数据获取的速度。可以使用缓存、分页、索引等技术来提高数据查询效率。
相关问题
grid = $("#datagrid").treegrid 如何结合datagrid-cache 实现加载效率的提升
可以通过以下步骤结合 `datagrid-cache` 插件来提高数据加载效率:
1. 引入 `datagrid-cache` 插件的 js 和 css 文件。
2. 在 `treegrid` 的初始化中,设置 `loadFilter` 属性为 `datagridCache` 方法,并传入相关参数,如下所示:
```javascript
$("#datagrid").treegrid({
url: "data.php",
idField: "id",
treeField: "text",
loadFilter: datagridCache({
pageSize: 10, // 每页加载的数据量
maxRows: 1000, // 最多缓存的数据量
queryParams: { // 查询参数
type: "tree"
}
})
});
```
3. 在 `url` 属性中指定数据的请求地址,并在 `queryParams` 中设置查询参数。
通过这样的方式,可以将数据缓存到本地,避免每次都从服务器请求数据,从而提高数据加载效率。同时,也可以通过调整 `pageSize` 和 `maxRows` 等参数来优化缓存策略,以达到更好的效果。
easyui 的grid = $("#datagrid").treegrid 如何实现多层级的树形 上移、下移
EasyUI 的 `treegrid` 组件是基于 `datagrid` 组件扩展而来的,因此可以在 `treegrid` 上使用 `datagrid` 的相关方法和事件。对于多层级的树形结构,可以通过递归遍历所有节点来实现上移、下移操作。
具体实现如下:
1. 获取当前选中的节点:
```javascript
var selectedNode = $('#datagrid').treegrid('getSelected');
```
2. 获取当前节点的父节点:
```javascript
var parentNode = $('#datagrid').treegrid('getParent', selectedNode.id);
```
3. 获取当前节点的所有兄弟节点:
```javascript
var siblings = $('#datagrid').treegrid('getChildren', parentNode ? parentNode.id : null);
```
4. 获取当前节点在兄弟节点中的位置:
```javascript
var index = siblings.indexOf(selectedNode);
```
5. 上移操作:
```javascript
if (index > 0) {
// 交换当前节点和前一个节点的位置
var prev = siblings[index - 1];
$('#datagrid').treegrid('swap', {
id: selectedNode.id,
parent: parentNode ? parentNode.id : null
}, {
id: prev.id,
parent: parentNode ? parentNode.id : null
});
}
```
6. 下移操作:
```javascript
if (index < siblings.length - 1) {
// 交换当前节点和后一个节点的位置
var next = siblings[index + 1];
$('#datagrid').treegrid('swap', {
id: selectedNode.id,
parent: parentNode ? parentNode.id : null
}, {
id: next.id,
parent: parentNode ? parentNode.id : null
});
}
```
需要注意的是,上移、下移操作可能会涉及到节点的父子关系,因此需要考虑好具体的操作逻辑,避免出现逻辑错误。
相关推荐
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)