javascript - React中是否可以打印16次

Question

我正在申请。例如，我尝试在以下代码中打印字母“a”16 次。但这没有用。这是因为我确实使用了“返回”。我知道。但它不使用错误。如何打印字母“a”16 次？

import React from "react";
import Game from "./game";

class App extends React.Component {
  constructor(props) {
    super(props);
    this.Game = new Game();
    console.log(this.Game.play());
  }
  draw = () => {
    for (let a = 0; a < 4; a++) {
      for (let b = 0; b < 4; b++) {
        return <div>a</div>;
      }
    }
  };
  componentDidMount = () => {
    this.draw();
  };
  render() {
    return (
      <div>
        <h2>2048 Game With React</h2>
        <p>{this.draw()}</p>
      </div>
    );
  }
}

export default App;

Answer 1

你应该只使用一个数组。填充数组然后返回它，React 将渲染组件数组。

import React from "react";
import Game from "./game";

class App extends React.Component {
  constructor(props) {
    super(props);
    this.Game = new Game();
    console.log(this.Game.play());
  }
  draw = () => {
    let result = [];
    for (let a = 0; a < 4; a++) {
      for (let b = 0; b < 4; b++) {
        result.push(<div>a</div>);
      }
    }
    return result;
  };
  componentDidMount = () => {
    this.draw();
  };
  render() {
    return (
      <div>
        <h2>2048 Game With React</h2>
        <p>{this.draw()}</p>
      </div>
    );
  }
}

export default App;