更新记录

1.6.2（2024-03-04）

fix:

1. 修复懒加载lazy，节点变更后，从懒加载数据中查找选中的相同值，而不是指定相同位置下标。

1.6.1（2024-02-19）

fix:

1. 修复懒加载lazy，无默认值时不展示数据问题

1.6.0（2024-01-23）

feat:

1. 新增懒加载功能，lazy设置是否懒加载，load函数加载下一层级数据

refactor:

1. 优化调整不同子级、相同子级切换时，不再设置为0，选中相同的节点。
2. 懒加载节点后默认选中之前已选中的相同的子节点。
3. 默认值value为数组时，懒加载后回默认选中默认值的层级数据

平台兼容性

ifun-tree-picker

树级结构数据选择组件。

• 树级机构化数据，可自定义键值属性。
• 绑定默认值。
• 可清除。
• 可选择父级节点。
• 支持懒加载节点数据

使用

通过uni_modules直接导入项目中。

<template>
    <view class="tree-select">
        <view class="component-item">
            <text  class="component-item-label">ifun-tree-picker</text>
            <view class="component-item-content">
                <ifun-tree-picker :data="treeData"></ifun-tree-picker>
            </view>

        </view>
    </view>
</template>

<script>
    export default {
        name:"tree-select",
        data() {
            return {
                treeData:[
                    {
                        value:'节点1',
                        label:'节点1',
                        children:[]
                    },
                    {
                        value:'节点2',
                        label:'节点2',
                        children:[
                            {
                                value:'节点21',
                                label:'节点21',
                            },
                            {
                                value:'节点22',
                                label:'节点22',
                                children:[
                                    {
                                        value:'节点221',
                                        label:'节点221',
                                    },
                                    {
                                        value:'节点222',
                                        label:'节点222',
                                    }
                                ]
                            }
                        ]
                    }
                ]
            };
        },
        methods:{

        }
    }
</script>

props 说明

lazy 说明

节点数据懒加载，对于关联数据不能组装到一起时的处理。

支持部分数据懒加载，仅当节点对象数据没有children或者为空时触发。这样也可以进行数据的缓存，避免重复请求，可以在懒加载后更新data的数据结构。

懒加载方法load,在:lazy="true"时生效，在节点选择变化时，触发调用，异步调用通过回调函数callback返回下一层级的节点数据。

注意：节点懒加载没有数据时，回调为空或者不调用。

value 说明

初始化默认值。保持picker打开和默认值选中一直，接受对象或者数组。

对象时和绑定的数据data结构保持一致，这种场景对于各个层级数据treeOptions.value都不相同时相对方便。

如果出现不同父级，但是子层级数据相同的情况，默人选中就只能使用数组了，数组的顺序按照层级顺序传入。

checkStrictly 说明

默认的选择当有children时，回默认选择子级的第一条数据，一直到节点没有子级。如果想要选到某一节点，则需要设置这个属性。

所有的下一级数据节点都会被填充空对象。在确认选择返回时，则只返回除这一层级外的其他层级数据。

treeOptions说明

事件

slot

默认slot - default. 自定义触发picker的内容。

默认的slot是一个input输入框,可以展示当前确定选择的最后一列对象的值。如果自定义则需要自己监听事件ok处理文本展示