我来自C#背景,但一般都是React和JS的新手.我想知道在声明数组时是否有办法使用lambda函数,例如：
this.state = {
arr: Array(9).fill( (i) => {<Foo index={i} />} ),};
我正在尝试使用索引中的升序值来生成React.Components数组,并且希望这是一个可行的选项.
解决方法
不单独使用.fill(),因为它只是分配而不是调用你给它的函数.
Array(3).fill(() => {}); // [ function,function,function ]
但是,您可以将它与.map()一起使用来实现此目的.您提供的迭代器函数将被赋予索引作为第二个参数(使用_作为第一个的一次性变量).
Array(9).fill(0).map((_,i) => <Foo index={i} />)
使用两者是必要的,因为Array(9)只分配数组的长度,使索引保持未分配状态.
'length' in Array(9) // true 0 in Array(9) // false
虽然.fill()将使用未分配的索引,但.map()特别会忽略它们.
您也可以使用Array.from(),它接受与.map()相同的迭代器.
Array.from(Array(9),(_,i) => <Foo index={i} />)
另外,使用它,第一个参数不一定必须是一个数组：
Array.from({ length: 9 },i) => <Foo index={i} />)