JSFiddle - React, Tailwind, and code Playground

by Tenderfeel

JavaScript

const origHeaders = [{
    "level": 2,
    "content": "ギャラリー",
    "text": "ギャラリー",
    "link": "ギャラリー",
    "isSpoiler": false,
    child: []
  },
  {
    "level": 2,
    "content": "ねたばれの見出し",
    "text": "ねたばれの見出し",
    "link": "ねたばれの見出し",
    "isSpoiler": true
  },
  {
    "level": 2,
    "content": "HHML要素",
    "text": "HHML要素",
    "link": "hhml要素",
    "isSpoiler": false,
    child: []
  },
  {
    "level": 3,
    "content": "見出しレベル３",
    "text": "見出しレベル３",
    "link": "見出しレベル３",
    "isSpoiler": false,
    child: []
  },
  {
    "level": 2,
    "content": "性格",
    "text": "性格",
    "link": "性格",
    "isSpoiler": false,
    child: []
  },
  {
    "level": 2,
    "content": "見出し",
    "text": "見出し",
    "link": "見出し",
    "isSpoiler": false,
    child: []
  }
];

const topLv = 2
const visibleLv = 3
const arrays = []

origHeaders
  .filter(header => header.level <= visibleLv)
  .forEach(header => {
    let parent
    if (header.level !== topLv) {
      parent = arrays[arrays.length - 1]
      parent.child.push(header)
    } else {
      arrays.push(header)
    }
  })

console.log(arrays)