封装树形数据处理函数

最新推荐文章于 2023-04-24 22:00:28 发布

跳动的世界线

最新推荐文章于 2023-04-24 22:00:28 发布

阅读量607

点赞数

分类专栏：学习笔记文章标签： javascript 前端开发语言

本文链接：https://blog.csdn.net/beatingworldline/article/details/122818208

版权

学习笔记专栏收录该内容

68 篇文章 4 订阅

订阅专栏

树形数据，每一级都有唯一的标识ID

const tree = [
    {
        title:'动漫',
        children:[
            {
                title:'那啥空',
                children:[
                    {title:'春日野穹'},
                    {title:'春日野空'},
                ],
            },
            {
                title:'猫和老鼠',
                children:[
                    {title:'Tom'},
                    {title:'Jerry'},
                ]
            }
        ]
    }
]

简单递归处理

function mapTree(treeData){
    treeData.forEach(treeNode=>{
       console.log(treeNode)
    
        if(treeNode?.children?.length){
            mapTree(treeNode.children)
        }
    })

}
mapTree(tree)

提取处理方法和节点key，封装函数

function mapTree(treeData,callback,childKey='children'){
    treeData.forEach(treeNode=>{
        callback(treeNode);
    
        if(treeNode?.[childKey]?.length){
            mapTree(treeNode[childKey],callback,childKey)
        }
    })

}
mapTree(tree,treeNode=>{
    console.log(treeNode)
})