显示深JSON对象后进行排序

Question

我有一个动态JSON对象，它具有多级深度以支持文件夹结构。

对象存储在一个状态中，类似于：

 {
      "_contents": [
        {
          "name": "filename_1",
          "path": "filename_1"
        },
        {
          "name": "filename_2",
          "path": "filename_2"
        }
      ],
      "folder_1": {
        "_contents": [
          {
            "name": "filename_1",
            "path": "folder_1/filename_1"
          },
          {
            "name": "filename sdafasdfasdfs",
            "path": "sasfasdfas"
          }
        ]
      },
      "folder_2": {
        "_contents": [],
        "folder_2_1": {
          "_contents": [
            {
              "name": "filename1.md",
              "path": "folder_2/folder_2_1/filename1.md"
            }
          ],
          "folder_2_1_1": {
            "_contents": [
              {
                "name": "filename1.md",
                "path": "folder_2/folder_2_1/folder_2_1_1/filename1.md"
              }
            ]
          }
        }
      }
    }

然后我将对象传递给生成UI文件夹视图的react组件。 使用此模块：https://www.npmjs.com/package/react-nested-file-tree

我遇到的问题是，在将对象状态传递给节点组件后，文件的顺序就会丢失。

他们进入1, 2, 3并在用户界面中以2,3,1（或其他随机顺序）出现。

这通常是通过深度JSON对象进行映射的问题。但我还没有找到预防或改变这种方法的方法吗？

有什么方法可以保留我的JSON对象的顺序，或者在构建UI之后进行排序？我已经查看了生成UI的其他模块，并且我得到了类似的结果。

编辑：我应该注意，我仅限于构建我的JSON对象以适应我正在使用的任何模块的格式。