Layui Tree组件使用setChecked设置默认选中项多的情况下加载速度过慢的问题

layuitree.js树形组件优化（默认选中项过多时加载缓慢问题解决）资源-CSDN文库

文件已经上传，有需要的可以直接下载使用

前阵子做一个项目,后台有一个省市联动的功能,需要用到layui 的tree组件,省市都是可选中项,用户选择指定的多个省或者市保存以后下载重新打开自动设置上次选中项,当选中的选项很多的时候,

重新打开页面加载就会十分的缓慢,慢到不能忍的地步,加载一个页面可能要10几秒以上,简直不能忍

经过检查后发现，之所以选中项多的时候加载慢是因为使用了 reInput.click();方法来设置checkbox选中状态，这样在数据很多的时候，会执行很多的click事件，导致加载很慢。

所以修改了tree组件设置选中项的实现逻辑,有click选中改为dom节点设置选中,然后性能得到了很大的提升,修改之后再点击默认选中项很多的页面事,很快就可以加载完毕.

以下是修改前的代码

  //若返回数字
      if(typeof checkedId === 'number'){
        if(thisId == checkedId){
          if(!input[0].checked){
            reInput.click();
          };
          return false;
        };
      } 
      //若返回数组
      else if(typeof checkedId === 'object'){
        layui.each(checkedId, function(index, value){
          if(value == thisId && !input[0].checked){
            reInput.click();
            return true;
          }
        });
      };

以下是修改后的代码

 if (item.length > 0) {
            //若返回数字
            if (typeof checkedId === 'number') {
                if (thisId == checkedId) {
                    if (!input[0].checked) {
                        reInput.click();
                    };
                    return false;
                };
            }
            //若返回数组
            else if (typeof checkedId === 'object') {
                layui.each(checkedId, function (index, value) {
                    if (value == thisId && !input[0].checked) {
                        //使用click()事件来选中当前节点，当默认选中项很多的时候加载速度太慢
                        //reInput.click();
                        //return true;
                        //设置当前节点input选中
                        input.prop("checked", "checked");
                        //设置当前节点上级input选中
                        input.parents(".layui-tree-pack").prev(".layui-tree-entry").children(".layui-tree-main").find('input[same="layuiTreeCheck"]').prop("checked", "checked");
                    }
                });
            };
        }
    });
      that.renderForm('checkbox');//重新渲染checkbox选中
  };