\n
\n {this.renderSquare(0)}\n {this.renderSquare(1)}\n {this.renderSquare(2)}\n
\n
\n {this.renderSquare(3)}\n {this.renderSquare(4)}\n {this.renderSquare(5)}\n
\n
\n {this.renderSquare(6)}\n {this.renderSquare(7)}\n {this.renderSquare(8)}\n
\n
\n );\n }\n}\n\nclass Game extends React.Component {\n constructor(props) {\n super(props);\n this.state = {\n history: [{\n squares: Array(9).fill(null),\n xIsNext: true,\n }]\n }\n }\n handleClick(i) {\n const history = this.state.history;\n const current = history[history.length -1];\n const squares = current.squares.slice();\n if (calculateWinner(squares) || squares[i]) {\n return;\n }\n squares[i] = this.state.xIsNext ? 'X' : 'O';\n this.setState({\n history: history.concat([{\n squares: squares,\n }]),\n xIsNext: !this.state.xIsNext,\n });\n }\n render() {\n const history = this.state.history;\n const current = history[history.length -1];\n const winner = calculateWinner(current.squares);\n\n const moves = history.map((step, move) => {\n const desc = move ?\n 'Go to move #' + move :\n 'Go to game start';\n return (\n