How to use element table to merge cells to achieve the desired effect

gets a three-tier nested data in the format of

[
  {
    name: 1,
    id: 1,
    children: [
      {
        name: 2,
        id: 2,
        children: [
          {
            name: 3,
            id: 3
          }
        ]
      }
    ]
  },
  {
    name: 4,
    id: 4,
    children: [
      {
        name: 5,
        id: 5,
        children: [
          {
            name: 6,
            id: 6
          }
        ]
      }
    ]
  }
]

the demand generates rows according to the number of second-level menus. If there are several second-level menus in the first-level menu, merge this first-level menu with several lines. The effect picture is roughly as follows:

how should I cycle through the data in table and do the function of merging cells? ask the bosses to give me an idea

May.17,2022

single column dynamic merge reference: https://codeshelper.com/q/10...
multiple column dynamic merge reference: https://codeshelper.com/a/11...

MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1b3a4ac-2b565.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1b3a4ac-2b565.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?