记layui的treeselect三层选择出错解决办法

这个其实也不是很困难的事情,因为今天无意中用到发现此bug,看网络上没有这个bug的说明和解决办法,记一下给有需要的人。
问题场景重现:
拿网上的demo为例:
在这里插入图片描述
看一下这个树形select框,并且是在下拉选可以模糊查询的情况下如下图:
在这里插入图片描述
我们看到下拉中有一个元素叫添加用户,那我们查询“加”如果按预期我们会找到这个元素的。
但事实是我们输入完并未找到这个元素,如下图:
在这里插入图片描述
先说一下解决办法吧,修改一下treeSelect.js的代码:

checkNodes: function (nodes) {
        for (var i = 0; i < nodes.length; i++) {
          var o = nodes[i],
              pid = o.parentTId,
              tid = o.tId;
          if (pid !== null){
            // 获取父节点
            $('#' + pid).addClass(TREE_SELECT_SEARCHED_CLASS);
            var pNode = TREE_OBJ.getNodesByParam("tId", pid, null);
            TREE_OBJ.expandNode(pNode[0], true, false, true);
          }
          $('#' + tid).addClass(TREE_SELECT_SEARCHED_CLASS);
        }
      },

改成

checkNodes: function (nodes) {
        for (var i = 0; i < nodes.length; i++) {
          var o = nodes[i],
              pid = o.parentTId,
              tid = o.tId;
          a.addPnodesClass(o);
          $('#' + tid).addClass(TREE_SELECT_SEARCHED_CLASS);
        }
      },
      addPnodesClass: function (node) {
    	  var pid = node.parentTId;
    	  if (pid !== null){
              // 获取父节点
              $('#' + pid).addClass(TREE_SELECT_SEARCHED_CLASS);
              var pNode = TREE_OBJ.getNodesByParam("tId", pid, null);
              TREE_OBJ.expandNode(pNode[0], true, false, true);
              a.addPnodesClass(pNode[0]);
            }
      },

其实改的也很简单,为什么到底第三层就找到了呢,因为当时这边写的有问题,它只给上一级的父节点展开,其余的节点都隐藏了。哈哈哈哈,那我上上级节点隐藏了,自然导致搜索不到结果了。所以这里不应该是找一次父节点,而应该是递归找父节点显示出来。小问题搞定,测试结果如下:
在这里插入图片描述

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值