Javascript 使用lodash展平嵌套对象/阵列

是否可以使用lodash展平此集合并连接路径字符串？我试过，但只能达到第二级，我想把它展平，不管深度如何，只要物体内部有一个pageRouter数组

{
    component: () => React.createElement('div', undefined, 'Parent Page'),
    exact: true,
    pageTitle: 'Parent',
    path: '/parent',
    pageRoute: [
      {
        component: () => React.createElement('div', undefined, 'Child Page'),
        exact: true,
        pageTitle: 'Child',
        path: '/child',
        pageRoute: [
          {
            component: () =>
              React.createElement('div', undefined, 'Grandchild Page'),
            exact: true,
            pageTitle: 'GrandChild',
            path: '/grandchild',
          },
        ],
      },
    ],
  },

这个

 [
    {
      component: () => React.createElement('div', undefined, 'Parent Page'),
      exact: true,
      pageTitle: 'Parent',
      path: '/parent',
    },
    {
      component: () => React.createElement('div', undefined, 'Child Page'),
      exact: true,
      pageTitle: 'Child',
      path: '/parent/child',
    },
    {
      component: () => React.createElement('div', undefined, 'Grandchild Page'),
      exact: true,
      pageTitle: 'GrandChild',
      path: 'parent/child/grandchild',
    },
  ],

尝试代码

const = routeList = _.flatMapDeep(publicRoutes, (x) => {
   if (x.pageRoute) {
      return [x, { ...x.pageRoute, path: x.path + _.head(x.pageRoute)?.path }];
     } else return x;
   });

---

不需要

lodash

。由于这是一个嵌套结构，因此似乎是递归函数的好机会：

const组件=[
{
组件：（）=>React.createElement（'div'，未定义，'Parent Page'），
确切地说：是的，
pageTitle:“父项”，
路径：'/parent'，
页面路径：[
{
组件：（）=>React.createElement（'div'，未定义，'Child Page'），
确切地说：是的，
页面标题：“儿童”，
路径：'/child'，
页面路径：[
{
组件：（）=>
React.createElement（'div'，未定义，'sunder Page'），
确切地说：是的，
页面标题：'孙子'，
路径：'/孙子'，
},
],
},
],
}
];
常量展平组件=[…展平组件（组件“”）]；
console.log（扁平化组件）；
函数*扁平化组件（嵌套组件、路径前缀）{
对于（嵌套组件的常量{pageRoute:routes，path，…component}）{
const newPath=`${pathPrefix}${path}`；
产生{…组件，路径：newPath}；
如果（路线）{
收益率*组成部分（路线、新路径）；
}
}
}

不需要

lodash

。由于这是一个嵌套结构，因此似乎是递归函数的好机会：

const组件=[
{
组件：（）=>React.createElement（'div'，未定义，'Parent Page'），
确切地说：是的，
pageTitle:“父项”，
路径：'/parent'，
页面路径：[
{
组件：（）=>React.createElement（'div'，未定义，'Child Page'），
确切地说：是的，
页面标题：“儿童”，
路径：'/child'，
页面路径：[
{
组件：（）=>
React.createElement（'div'，未定义，'sunder Page'），
确切地说：是的，
页面标题：'孙子'，
路径：'/孙子'，
},
],
},
],
}
];
常量展平组件=[…展平组件（组件“”）]；
console.log（扁平化组件）；
函数*扁平化组件（嵌套组件、路径前缀）{
对于（嵌套组件的常量{pageRoute:routes，path，…component}）{
const newPath=`${pathPrefix}${path}`；
产生{…组件，路径：newPath}；
如果（路线）{
收益率*组成部分（路线、新路径）；
}
}
}

您是否尝试过展平或展平深度？是否可以发布您尝试的代码？

\uuu.flatMapDeep（publicRoutes，（x）=>{if（x.pageRoute）{return[x，{…x.pageRoute，path:x.path+uuuu.head（x.pageRoute）？.path}；}否则返回x；}）

您是否尝试过展平或展平深度？您可以发布您尝试的代码吗？

.flatMapDeep（publicRoutes，（x）=>{if（x.pageRoute）{return[x，{…x.pageRoute，path:x.path+.\head（x.pageRoute）}否则返回x；}）

哇，这太棒了！我还没有想到一个函数生成器，使用一个简单的循环会有所不同吗？简单的循环也可以；我觉得生成器很优雅。我得到的

flattleComponents'隐式具有返回类型“any”，因为它没有返回类型注释，并且在其返回表达式中直接或间接引用。

当我使用typescript时，出现此错误，

函数*flattleComponents（nestedComponents:PageRoute[]，pathPrefix:string=''）

仍然不用于生成器，因此我不知道从何处推断返回类型您可以将返回值键入为

Iterable

，其中

Foo

具有每个组件对象的结构。哇，这太棒了！我还没有想到一个函数生成器，使用一个简单的循环会有所不同吗？简单的循环也可以；我觉得生成器很优雅。我得到的

flattleComponents'隐式具有返回类型“any”，因为它没有返回类型注释，并且在其返回表达式中直接或间接引用。

当我使用typescript时，出现此错误，

函数*flattleComponents（nestedComponents:PageRoute[]，pathPrefix:string=''）

仍不用于生成器，因此我不知道从何处推断返回类型您可以将返回值键入为

Iterable

，其中

Foo

具有每个组件对象的结构。