summary |
shortlog |
log |
commit | commitdiff |
tree
raw |
patch |
inline | side by side (from parent 1:
c6ffca5)
There is an "active" property up and down our component stack, (at the
board level, whether it's the current players turn; further at the
mini-grid level, whether it's a legal mini-grid; further still at the
square level, whether the square is unoccupied). It's clear enough to
uses a props name of "active" at each level.
But when using a local variable to compute the child's "active" prop
while in a current component with its own "active" prop, this can get
confusing.
So, at the board level, use a local variable of "grid_active" to
compute the "active" prop for the child grid.
* b. This mini grid corresponds to this players last turn
* c. The mini grid that corresponds to the players last turn is full
*/
* b. This mini grid corresponds to this players last turn
* c. The mini grid that corresponds to the players last turn is full
*/
+ let grid_active = false;
if (this.props.last_two_moves.length > 1) {
/* First index (0) gives us our last move, (that is, of the
* last two moves, it's the first one, so two moves ago).
if (this.props.last_two_moves.length > 1) {
/* First index (0) gives us our last move, (that is, of the
* last two moves, it's the first one, so two moves ago).
/* If the target mini-grid isn't full then this grid is
* only active if it is that target. */
if (occupied < 9)
/* If the target mini-grid isn't full then this grid is
* only active if it is that target. */
if (occupied < 9)
- active = (i === target);
+ grid_active = (i === target);
return (
<MiniGrid
squares={squares}
return (
<MiniGrid
squares={squares}
last_moves={last_moves}
onClick={(j) => this.props.onClick(i,j)}
/>
last_moves={last_moves}
onClick={(j) => this.props.onClick(i,j)}
/>