如何从数据中动态生成选择器？

Question

我有从后端获取的以下格式的数据：

0:
  project_name: "Tele2"
  subprojects: Array(9)
          0: "vdvdfgvf"
          1: "vdfvfv"
          2: "bgfbgfn"
          3: "bdfbfg"
          4: "gfbgfb"
          5: "bfgbfbf"
          6: "bfgbfgb"
          7: "vdvfv"
          8: "bfbgbgb"
    length: 9
    __proto__: Array(0)
 _id: {$oid: "11111"}
 __proto__: Object
1:
  project_name: "AidaFinance"
  subprojects: Array(5) 
          0: "gvfbb"
          1: "gbffg"
          2: "vfvfdvdf"
          3: "bfgbfg"
          4: "vfdbfgbf"
     length: 5
     __proto__: Array(0)
  _id: {$oid: "11111"}
  __proto__: Object

可以有两个以上的0、1对象。子项目中可以有任意数量的元素。

问题是我需要动态生成（materialUI）元素。

首先，应该有代表项目名称的名称。用户选择项目后，第二个项目应立即可单击，并且应包含所选项目的子项目。我有单独的API调用，如果您需要它来获取项目的子项目。

它返回的数据如下：

0:
    project_name: "Tele2"
    subprojects: Array(9)
          0: "vdvdfgvf"
          1: "vdfvfv"
          2: "bgfbgfn"
          3: "bdfbfg"
          4: "gfbgfb"
          5: "bfgbfbf"
          6: "bfgbfgb"
          7: "vdvfv"
          8: "bfbgbgb"

Answer 1

我为上述问题创建了一个codeandbox。 Please check。