xmSelect 多选树形组件获取父节点 value 的方法

在使用 xmSelect 多选树形组件时,如果需要在有子节点的选项中一起获取父节点的 value,可以通过遍历选中的节点,并判断是否有子节点来实现。在 on 事件回调函数中,可以使用递归函数来处理每个节点。

代码示例

var xm_one = xmSelect.render({
    el: '#tree_one',
    // 其他配置项...
    on: function (data) {
        var ids = [];
        data.arr.forEach(function (item) {
            // 递归函数,处理每个节点
            function handleNode(node) {
                if (node.children) {
                    node.children.forEach(function (child) {
                        // 判断子节点是否被选中
                        if (child.selected) {
                            ids.push(child.value); // 添加子节点的 value
                        }
                        handleNode(child); // 递归处理子节点
                    });
                }
            }
            ids.push(item.value); // 添加父节点的 value
            handleNode(item); // 处理父节点的子节点
        });
        var result = ids.join(',');
        $('#industry').val(result);
    },
});

代码解析

  1. 定义一个空数组 ids 来存储选中节点的 value。
  2. 遍历选中的节点,使用递归函数 handleNode 来处理每个节点。
  3. 在递归函数中,判断节点是否有子节点。如果有,则继续遍历子节点,并判断子节点是否被选中。如果被选中,则将其 value 添加到 ids 数组中。
  4. 递归调用 handleNode 函数来处理子节点的子节点。
  5. 最后,将 ids 数组转为字符串,使用逗号分隔,并将结果赋值给 #industry 元素的 value 属性。

通过以上方法,可以实现获取 xmSelect 多选树形组件中选中节点的父节点 value 的功能。

xmSelect 多选树形组件获取父节点 value 的方法

原文地址: https://www.cveoy.top/t/topic/qeJ0 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录