在 javascript 中創建嵌套的 object

Question

我想在 javascript 中創建一個嵌套的 object，如下所示。

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'
            }
          ]
        }
      ]
    }
  ]
}

object 從Context 1開始，每個“上下文”將有 2 或 3 個options ，每個option將有一個Context ，並且該Context可以再次具有 2/3 options ，依此類推。

用戶可以控制定義我們要將 object 擴展到哪個級別。

按級別，它的定義是這樣的

我用ReactJs嘗試了類似的方法，但沒有成功。

State：

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

第一個代碼片段有問題： data變量是 object，因為它有大括號{} ，但它沒有任何鍵。 這肯定會導致 JavaScript 運行時錯誤。

相反，我建議使用以下數據 model。

根數據 object：

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
}

解釋：看起來您必須創建的data object 是遞歸 object。 遞歸對象是包含在自身內部的對象。 例如， option1鍵可以包含與data變量相同的 object，如下面的代碼片段所示。 這同樣適用於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
}