不能在React渲染中使用map函数

时间:2018-01-11 19:55:26

标签: javascript arrays reactjs

我正在尝试使用map()函数以3D Reacts'方法迭代render数组,但不知何故它不起作用且webpack投诉有一个意外的令牌。这是我班级的完整代码:

class ExpressionGraph extends Component {
render() {
  const offsetX = - window.innerWidth / 4;
  const offsetY = - window.innerHeight / 4;
const x = 20;
const y = 20;
console.log(test_data["data"]);
const data = test_data["data"];

return (
  <Stage width={window.innerWidth} height={window.innerHeight}>
    <Layer offsetX={offsetX} offsetY={offsetY}>

not working -------> data.map((typeArr, idx) => {

        console.log(typeArr);
        console.log(idx);
        typeArr.map((neuronArr, typeIdx) => {
          const numOfPoints = neuronArr[0].length;
          const circleColor = Konva.Util.getRandomColor();
          [...Array(numOfPoints)].map((_, pointIdx) => {
            const x = neuronArr[0][pointIdx];
            const y = neuronArr[1][pointIdx];
            console.log("x: " + x);
            console.log("y: " + y);
            console.log("circleColor: " + circleColor);
            return <ColoredCircle x={x} y={y} color={circleColor}/>
          })
        })
      })
    </Layer>
  </Stage>
);
}
}

1 个答案:

答案 0 :(得分:1)

将地图声明包裹在{}

   {data.map((typeArr, idx) => {

    console.log(typeArr);
    console.log(idx);
    typeArr.map((neuronArr, typeIdx) => {
      const numOfPoints = neuronArr[0].length;
      const circleColor = Konva.Util.getRandomColor();
      [...Array(numOfPoints)].map((_, pointIdx) => {
        const x = neuronArr[0][pointIdx];
        const y = neuronArr[1][pointIdx];
        console.log("x: " + x);
        console.log("y: " + y);
        console.log("circleColor: " + circleColor);
        return <ColoredCircle x={x} y={y} color={circleColor}/>
      })
    })
  })}
</Layer>