为什么 typescript (tsx) 在 map 使用两次时不 return html？

Question

我用这种方法制作了数组：

  const newArray: Array<Array<any>> = [];

  for (let i = 0; i < codeData?.length; i++) {
    if (i % 3 === 1) {
      newArray.push([codeData[i - 1], codeData[i], codeData[i + 1]].filter(el => el !== undefined));
    }

  }

但是当我尝试映射它两次时它没有 return HTML ，但是当我将最后一个映射的值设置到控制台时它 return 就是我需要：

                 {newArray
                ?.slice(
                  page * rowsPerPage,
                  page * rowsPerPage + rowsPerPage
                )
                ?.map((arr: any) => {
                  arr
                    .filter((element) => element !== undefined)
                    .map((row: any) => {
                      return (
                        <TableRow
                          role="checkbox"
                          key={row.id}
                          className={classes.row}
                        >
                          {row.id}
                        </TableRow>
                      );
                    });
                })}

我想这是因为打字稿，据我所知，有这个动态 - [] 但是当我使用地图两次时它有 - [[]].

有人可以帮助我吗？

Answer 1

map return 一个数组，如果你嵌套它们，你也会得到嵌套数组。

如果您将第一个 map 更改为 flatMap，它会将结果合并为一个数组。

为什么 typescript (tsx) 在 map 使用两次时不 return html？

Why typescript (tsx) doesn't return html when map is using twice?

javascript

arrays

typescript

reactjs

tsx