reactjs-material-ui中的多层嵌套列表

我想创建多层嵌套列表,以在左侧显示菜单-与官方网站https://material-ui-next.com/非常相似.
数据源在JSON中,其中每个项目还包含有关父项目和其他一些数据的信息-这是示例:

{
    "task_number": 1201092,
    "task": "Monthly Cash Flow from Deliveries",
    "task_parent_number": 1201090,
    "task_parent": "Wholesale Cash Flow"
},
{
    "task_number": 1201095,
    "task": "Monthly Cash Flow from Fix Amounts",
    "task_parent_number": 1201090,
    "task_parent": "Wholesale Cash Flow"
},
{
    "task_number": 1201100,
    "task": "Wholesale Positions",
    "task_parent_number": 1200007,
    "task_parent": "Wholesale Contract Portfolio"
},
{
    "task_number": 1201200,
    "task": "All Wholesale Positions",
    "task_parent_number": 1201100,
    "task_parent": "Wholesale Positions"
}

我可以创建一个带有各种嵌套元素的对象-子元素-如果它们具有followin函数:

function getNestedChildren(arr, parent) {
  var out = [];
  for (var i in arr) {
    if (arr[i].task_parent_number == parent) {
      //console.log(i, arr[i].task_parent_number, arr[i].task_number);
      var children = getNestedChildren(arr, arr[i].task_number);
      if (children.length) {
        arr[i].children = children;
      }
      out.push(arr[i]);
    }
  }

  return out;
}

我一直按照说明创建嵌套列表并将其导入此处:https://material-ui-next.com/demos/lists/#nested-list

..但是我无法根据需要创建带有嵌套元素的菜单. .如果有人能指出我正确的方向,那就太好了.

最佳答案
好的,我把这两个部分结合起来了:

> React示例递归渲染:https://gist.github.com/nkvenom/bf7b1adfe982cb47dee3
>此处的物料清单指南-https://medium.com/@ali.atwa/getting-started-with-material-ui-for-react-59c82d9ffd93

转载注明原文:reactjs-material-ui中的多层嵌套列表 - 代码日志