SearchTree.jsx

import React, { useState } from 'react';
import style from '../index.less'
import DirectoryTree from '@/components/DirectoryTree'

const SearchTree = (props) => {
    const { userTree, setProcess } = props
    const [expandedKeys, setExpandedKeys] = useState([])
    const [autoExpandParent, setAutoExpandParent] = useState(true)
    let allUser = []
    const initTreeData = (tree) => {
        if (!tree || tree?.length === 0) return;
        return tree.map(item => {
            const users = item?.userList || []
            let children = initTreeData(item.subList);
            if (users.length > 0) {
                const userList = users.map(user => ({
                    title: user.name,
                    key: `user-${user.id}`,
                    id: user.id,
                    avatarUrl: user.avatarUrl,
                    selectable: true
                }))
                children = children?.length > 0 ? children.concat(userList) : userList
                allUser = allUser.concat(item.userList)
            }
            return {
                title: item.name,
                key: item.id,
                id: item.id,
                children,
                selectable: false
            }
        })
    }
    const treeData = initTreeData(userTree)
    const onSelect = (selectedKeys, info) => {
        console.log('selected', selectedKeys, info);
        console.log(`info node is:`, info.node.title)
        setProcess(selectedKeys, info)
    };
    const onExpand = expandedKeys => {
        setExpandedKeys(expandedKeys)
        setAutoExpandParent(false);
    };
    console.log(treeData , autoExpandParent)
    return (
        <div className={style.popover_tree}>
            <DirectoryTree
                showIcon={false}
                placeholder="请输入搜索名称"
                directoryData={treeData}
                onSelect={onSelect}
                autoExpandParent={true}
                onExpand={onExpand}
                expandedKeys={expandedKeys}
            />
        </div>
    );
};

export default SearchTree;