Question

所以，如果我想做像

这样的事情

var numberOfRows = 5;
numberOfRows.map(index => {
    return(<tr></tr>)
})

我知道我可以创建一个空列表，但这似乎是错误的。我觉得这可能是一个功能，我只是不知道。

Answer 1

我想你想实现这个目标：

Array(numberOfRows).fill().map(index => {
    return(<tr></tr>)
})

它将呈现<tr>变量中指定的相同数量的numberOfRows标记。

Answer 2

您可以使用Array.from回调，其行为类似于map：

Array.from(Array(numberOfRows), _ => {
    return(<tr></tr>)
})

或者，要在映射完成之前真正避免创建数组：

const length = 5;
Array.from({length}, _ => {
    return(<tr></tr>)
})

此处名称选择为length，因此短ES6表示法可用于对象文字。否则它将是{ length: numberOfRows }。

Answer 3

与Andrzej的答案类似，您也可以这样做：

[...Array(numberOfRows)].map(index => {
  return(<tr></tr>)
});

Answer 4

您正在寻找的是

[...Array(n).keys()]

因此，您可以在地图中以高阶方式使用index：

[...Array(n).keys()].map(index => {
  // do something with the index value
  return(<tr></tr>)
})

例如：

[...Array(10).keys()]
> Array [ 0, 1, 2, 3, 4, 5, 6, 7, 8, 9 ]

[...Array(10).keys()].map(index => index + 1)
> Array [ 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 ]

什么是与Array.map等效的Integer？

4 个答案: