title: Pass state to child component - React Tutorial
body: <p>I've been following the official React Tutorial <a href="https://facebook.github.io/react/tutorial/tutorial.html" rel="nofollow noreferrer">here</a>. And I've reached the point where when I click a square, it calls the Board's handleClick function to update the squares states.<br> However, after the states are updated in the Board class, they aren't propagated down to the squares' states.<br>
  Here's my code:</p>
  
  <pre><code> class Square extends React.Component {
     constructor() {
      super();
      this.state = {
        value: null,
      };
    }
    render() {
      return (
        &lt;button className="square" onClick={() =&gt;this.props.onClick()}  &gt;
        {this.state.value}
        &lt;/button&gt;
      );
    }
  }
  
  class Board extends React.Component {
    constructor() {
      super();
      this.state = {
        squares: Array(9).fill(null),
      };
    }
  
    renderSquare(i) {
     return &lt;Square value={this.state.squares[i]} onClick={() =&gt; this.handleClick(i)} /&gt;;
    }
    render() {
      const status = 'Next player: X';
      return (
        &lt;div&gt;
          &lt;div className="status"&gt;{status}&lt;/div&gt;
          &lt;div className="board-row"&gt;
            {this.renderSquare(0)}
            {this.renderSquare(1)}
            {this.renderSquare(2)}
          &lt;/div&gt;
          &lt;div className="board-row"&gt;
            {this.renderSquare(3)}
            {this.renderSquare(4)}
            {this.renderSquare(5)}
          &lt;/div&gt;
          &lt;div className="board-row"&gt;
            {this.renderSquare(6)}
            {this.renderSquare(7)}
            {this.renderSquare(8)}
          &lt;/div&gt;
        &lt;/div&gt;
      );
    }
      handleClick(i) {
    const squares = this.state.squares.slice();
    squares[i] = 'X';
        debugger;
    this.setState({squares: squares});
  }
  }
  </code></pre>
  
  <p><a href="https://codepen.io/mohamed3on/pen/jVVyWZ?editors=1010" rel="nofollow noreferrer">https://codepen.io/mohamed3on/pen/jVVyWZ?editors=1010</a>
  I've followed the tutorial exactly until the "Why Immutability Is Important" part. I know</p>