当前位置: 代码网 > it编程>编程语言>Javascript > el-tree限制选中个数的实例

el-tree限制选中个数的实例

2024年09月08日 Javascript 我要评论
el-tree限制选中个数 <el-tree style="max-width: 600px" :data="treedata" :chec

 el-tree限制选中个数

 <el-tree
          style="max-width: 600px"
          :data="treedata"
          :check-strictly="true"
          show-checkbox
          node-key="id"
          :props="defaultprops"
          :default-expanded-keys="['1', '2']"
          ref="treeref"
          @check="handlecheckchange"
        />
const handlecheckchange = (data: any, checked: any) => {
  const selectednodes = treeref.value.getcheckednodes();
  if (selectednodes.length > 3 && checked) {
    treeref.value.setchecked(data, false); // 取消选中超出限制的节点
    elmessage.warning(`您最多只能选择 ${3} 个节点!`);
  }
};
const handlecheckchange= (currnode: any, checkedinfo: any) => {
  let checkedkeys = checkedinfo.checkedkeys || [];
  let treenodesmap = treeref.value.store?.nodesmap || {};
  let status = checkedkeys.length >= 3;
  if (status) {
    elmessage.warning(`您最多只能选择 ${3} 个节点!`);
  }
  object.keys(treenodesmap).foreach((key) => {
    let item = treenodesmap[key] || {};
    if (!checkedkeys.includes(key)) {
      let data = item.data || {};
      data.disabled = status;
      treeref.value.setcurrentnode(data);
    }
  });
};

到此这篇关于el-tree限制选中个数的文章就介绍到这了,更多相关el-tree限制选中个数内容请搜索代码网以前的文章或继续浏览下面的相关文章希望大家以后多多支持代码网!

(0)

相关文章:

版权声明:本文内容由互联网用户贡献,该文观点仅代表作者本人。本站仅提供信息存储服务,不拥有所有权,不承担相关法律责任。 如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 2386932994@qq.com 举报,一经查实将立刻删除。

发表评论

验证码:
Copyright © 2017-2025  代码网 保留所有权利. 粤ICP备2024248653号
站长QQ:2386932994 | 联系邮箱:2386932994@qq.com