在javascript中创建嵌套对象

Question

我想在 javascript 中创建一个嵌套对象，如下所示。

const data = {
  name: 'Context 1',
  children: [
    {
      name: 'Option 1',
      children: [
        {
          name: 'Context',
          children: [
            {
              name: 'Option'
            },
             {
               name: 'Option'
             }
          ]
        }
      ]
    },
    {
      name: 'Option 2',
      children: [
        {
          name: 'Context 1',
          children: [
            {
              name: 'Option'
            },
            {
              name: 'Option'
            }
          ]
        }
      ]
    }
  ]
}

从Context 1开始的对象，每个“上下文”将有2或3个options，每个option将有一个Context，而Context又可以有2/3个options等等开。

用户可以控制定义我们要将对象扩展到哪个级别。

按级别定义如下

我用 ReactJs 尝试过类似的操作，但没有成功。

状态：

this.state = {
   myContentIndex: 1,
   myLevelIndex: 0,
   levels: 3,
}

我的功能：

我给addContext([], 3)打了电话

addContext = async (data, options) => {
  const myData = [...data]
  const { myContextIndex, myLevelIndex, levels } = this.state
  await myData.push(this.getDataNodeObject('Context', myContextIndex))
  this.setState({ myContextIndex: myContextIndex + 1 }, async () => {
    var nextData = await this.setOptions(myData[0].children, options)
    if (myLevelIndex <= levels) {
      this.setState({ myLevelIndex: myLevelIndex + 1 }, async () => {
        await nextData.forEach(item =>
          this.addContext(item.children, options)
        )
      })
    }
    await nextData.forEach(item => myData[0].children.push(item))
  })
  return myData
}

setOptions = async (data, options) => {
  let arr = [...data]
  for (let i = 0; i < options; i++) {
    await arr.push(this.getDataNodeObject('Option', i + 1))
  }
  return arr
}

 getDataNodeObject = (name, index) => ({
   name: `${name + ' ' + index}`,
   children: [],
   index: index
 })

有没有办法在所有这些条件下做到这一点？

Answer 1

第一个代码 sn-p 有问题：data 变量是一个对象，因为它有大括号 {}，但它没有任何键。这肯定会导致 JavaScript 运行时错误。

相反，我提出以下数据模型。

根数据对象：

const data = {
  name: "Context 1",
  option1: {}, // Inside the option1 property you can place an object that is identical to the data variable
  option2: {} // Inside the option2 property you can place an object that is identical to the data variable
}

解释：看起来你必须创建的dataobject 是一个递归对象。递归对象是包含在自身内部的对象。例如，option1key 可以包含一个与data变量相同的对象，如下面的代码 sn-p 所示。这同样适用于option2 属性。

const data = {
  name: "Context 1",
  option1: {
    name: "Context 2",
    option1: {},
    option2: {}
  }
  option2: {} // Inside the option2 property you can place an object that is identical to the data variable
}