Question

按以下方式生成数组：

for(var i = start; i <= end;i+=step) {
    arr[i] = i + 'is the number';
}

数组结构如下所示

arr = [
1100: "1100 is the number",
1101: "1101 is the number",
1102: "1102 is the number",
1103: "1103 is the number",
1104: "1104 is the number",
1105: "1105 is the number",
];

等等。

此数组将映射到React中的列表元素。

render() {
    const list = this.arr;
    const timeList = list.map((element) =>
        <li>{element}</li>
        );


    return (
      <div className="App" >
        {timeList}
      </div>
    );

它与常规数组一起工作正常，但使用这个数组会给我一个无限循环。

为什么会发生这种情况以及解决这个问题的可能性有哪些？

谢谢

更新：发现了＆＃34;如果使用命名索引，JavaScript会将数组重新定义为标准对象。之后，一些数组方法和属性将产生不正确的结果。＆＃34;

但仍无法解决问题

Answer 1

我假设你的渲染函数中有arr变量。您的问题是“this.arr”。从此处删除“this”并使用“arr”。

这是工作代码，我检查了我的本地反应设置，它打印了数组：

render() {
    const arr = [
         1100: "1100 is the number",
         1101: "1101 is the number",
         1102: "1102 is the number",
         1103: "1103 is the number",
         1104: "1104 is the number",
         1105: "1105 is the number",
     ];
    const list = arr;
    const timeList = list.map((element, idx) =>
        <li key={idx}>{element}</li>
        );


    return (
      <div className="App" >
        {timeList}
      </div>
    );
}

Answer 2

可能是i＆lt; =结束？你试过start.length等等。

另一个解决方案是尝试切换到map（）函数。

请告诉我。

如何在React / ES6中映射assosiative数组？开始无限循环

2 个答案: