listToTree

db에서 조회한 리스트를 화면에서 트리로 표현하기 위해 계층구조로 변환 한다.

const menuList = [
  { menuId: 'A', prMenuId: '' },
  { menuId: 'A1', prMenuId: 'A' },
  { menuId: 'A2', prMenuId: 'A' },
  { menuId: 'A3', prMenuId: 'A' },
  { menuId: 'B', prMenuId: '' },
  { menuId: 'B1', prMenuId: 'B' },
  { menuId: 'B2', prMenuId: 'B' },
  { menuId: 'B3', prMenuId: 'B2' },
]
const menuTree = listToTree<Menu>(menuList, 'menuId', 'prMenuId', 'child')

menuList

[
  {
    "menuId": "A",
    "prMenuId": ""
  },
  {
    "menuId": "A1",
    "prMenuId": "A"
  },
  {
    "menuId": "A2",
    "prMenuId": "A"
  },
  {
    "menuId": "A3",
    "prMenuId": "A"
  },
  {
    "menuId": "B",
    "prMenuId": ""
  },
  {
    "menuId": "B1",
    "prMenuId": "B"
  },
  {
    "menuId": "B2",
    "prMenuId": "B"
  },
  {
    "menuId": "B3",
    "prMenuId": "B2"
  }
]

menuTree

[
  {
    "menuId": "A",
    "prMenuId": "",
    "lv": 1,
    "child": [
      {
        "menuId": "A1",
        "prMenuId": "A",
        "lv": 2
      },
      {
        "menuId": "A2",
        "prMenuId": "A",
        "lv": 2
      },
      {
        "menuId": "A3",
        "prMenuId": "A",
        "lv": 2
      }
    ],
    "isCollapsed": true
  },
  {
    "menuId": "B",
    "prMenuId": "",
    "lv": 1,
    "child": [
      {
        "menuId": "B1",
        "prMenuId": "B",
        "lv": 2
      },
      {
        "menuId": "B2",
        "prMenuId": "B",
        "lv": 2,
        "child": [
          {
            "menuId": "B3",
            "prMenuId": "B2",
            "lv": 3
          }
        ],
        "isCollapsed": true
      }
    ],
    "isCollapsed": true
  }
]

findRecursive

array 또는 트리 구조의 object에서 검색한다. listToTree 함수로 변환후 검색필요할때 사용.

findResult.value = findRecursive(menuTree.value, 'menuId', 'A3')

listToTree #

findRecursive #

listToTree

findRecursive