為什么 map 使用兩次時 typescript (tsx) 不返回 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));
    }

  }

但是當我嘗試 map 它兩次它不會返回HTML ，但是當我將最后一個 map 的值設置到控制台時，它會返回我需要的內容：

                 {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>
                      );
                    });
                })}

我想這是因為 typescript，據我所知，有這個動態 - []但是當我使用 map 兩次它有 - [[]] 。

任何人都可以幫助我嗎？

Answer 1

map返回一個數組，如果你嵌套它們，你也會得到嵌套的 arrays。

如果您將第一個map更改為flatMap ，它會將結果折疊成單個數組。