react 加粗_React入门的家庭作业（1-2）

作业前准备

React在他的官网上挂了一个入门教程，是做一个xxoo棋的小游戏，在教程的最后留下了6个作业题，现在就来完成一下

准备材料

作业是在已完成教程的基础上做的，所以这里预设已经做好了环境部署，写好了游戏代码(如果没有，可以把这个复制进去)，并成功运行了该游戏，如果上面的都准备就绪，那我们就可以开动了

第一题 在游戏历史记录列表显示每一步棋的坐标，格式为 (列号, 行号)

历史记录是保存为数组history的，数组的每一个元素表示每一步棋，现在的要求是对于每一步棋，不仅要显示棋盘的布局(数组squares)，还要显示这步棋下在了哪里了，那我们就对【每步棋】这个对象再添加一个坐标(行号row，列号col)

首先，在构造函数constructor中修改代码如下

constructor(props) {

super(props);

this.state = {

history: [{

squares: Array(9).fill(null),

//在这里添加两个新属性，行号和列号 row: null,

col: null,

}],

stepNumber: 0,

xIsNext: true,

}

}

然后，在每次点击棋盘格子时，会触发handleClick()方法，该方法会改变state的值，其中也包括新添加的坐标，所以我们修改handleClick()方法下的this.setState()