Vue将将后端返回的list数据转化为树结构的实现

 更新时间:2022年05月13日 08:57:03   作者:~疆  
本文主要介绍了Vue将将后端返回的list数据转化为树结构的实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

下载

cnpm i -S array-to-tree

引入

import arrayToTree from "array-to-tree";

使用

    const pidData = [
      { name: "aa", id: "1", pid: null },
      { name: "bb", id: 2, pid: 1 },
      { name: "cc", id: 3, pid: "" },
      { name: "dd", id: 4, pid: 3 },
      { name: "ee", id: 5, pid: "3" },
    ];
    const result = arrayToTree(pidData, {
      parentProperty: "pid",
      customID: "id",
      childrenProperty: "children",
    });
    console.log(result);

到此这篇关于Vue将将后端返回的list数据转化为树结构的文章就介绍到这了,更多相关Vue将将后端返回的list数据转化为树结构内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • vue的异步数据更新机制与$nextTick用法解读

    vue的异步数据更新机制与$nextTick用法解读

    这篇文章主要介绍了vue的异步数据更新机制与$nextTick用法解读,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2023-03-03
  • vue-video-player实现实时视频播放方式(监控设备-rtmp流)

    vue-video-player实现实时视频播放方式(监控设备-rtmp流)

    这篇文章主要介绍了vue-video-player实现实时视频播放方式(监控设备-rtmp流),具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2020-08-08
  • Vue3.0之引入Element-plus ui样式的两种方法

    Vue3.0之引入Element-plus ui样式的两种方法

    本文主要介绍了Vue3.0之引入Element-plus ui样式的两种方法,文中通过示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-02-02
  • vue+elementui通用弹窗的实现(新增+编辑)

    vue+elementui通用弹窗的实现(新增+编辑)

    这篇文章主要介绍了vue+elementui通用弹窗的实现(新增+编辑),文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2021-01-01
  • element ui el-date-picker组件默认值方式

    element ui el-date-picker组件默认值方式

    这篇文章主要介绍了element ui el-date-picker组件默认值方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
    2023-12-12
  • Vue的样式绑定详解

    Vue的样式绑定详解

    这篇文章主要为大家详细介绍了Vue的样式绑定,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下,希望能够给你带来帮助
    2022-02-02
  • Vue中子组件调用父组件的3种方法实例

    Vue中子组件调用父组件的3种方法实例

    vue子组件调用父组件的方法其实不难,最近整理了一下,下面这篇文章主要给大家介绍了关于Vue中子组件调用父组件的3种方法,需要的朋友可以参考下
    2022-05-05
  • 五步教你用Nginx部署Vue项目及解决动态路由刷新404问题

    五步教你用Nginx部署Vue项目及解决动态路由刷新404问题

    nginx 是一个代理的服务器,下面这篇文章主要给大家介绍了关于如何通过五步教你用Nginx部署Vue项目及解决动态路由刷新404问题的相关资料,文中通过图文介绍的非常详细,需要的朋友可以参考下
    2022-12-12
  • nuxt.js写项目时增加错误提示页面操作

    nuxt.js写项目时增加错误提示页面操作

    这篇文章主要介绍了nuxt.js写项目时增加错误提示页面操作,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2020-11-11
  • vue实现无限消息无缝滚动

    vue实现无限消息无缝滚动

    这篇文章主要为大家详细介绍了vue实现无限消息无缝滚动,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-04-04

最新评论