title: Passed property to child component is being logged false per default
body: <p>I didn't know how to specify the title.</p>
  
  <p>Here is my problem:</p>
  
  <p>I have a parent component which passes down it's default state as properties to some child component.</p>
  
  <p>One of these default states is being passed as following:</p>
  
  <pre><code>&lt;FriendButton is_friend={this.props.is_friend} /&gt;
  </code></pre>
  
  <p><strong>FriendButton is in a child component of the parent, thats why it is this.props here</strong></p>
  
  <p>So this is what I am trying to pass to <code>&lt;FriendButton /&gt;</code> :</p>
  
  <pre><code>this.props.is_friend == true
  </code></pre>
  
  <p>So now inside my <code>&lt;FriendButton /&gt;</code> component I want to deal with that value. Weirdly enough it gets logged as "<code>false</code>".</p>
  
  <p>Here is my simple code to check that:</p>
  
  <pre><code>import React from 'react';
  
  class FriendButton extends React.Component {
    constructor(){
      super();
  
      this.state = {
        friend_status: ""
      }
    }
    componentWillMount(e){
      console.log("Friend status at friend button: ",this.props);
      if(this.props.is_friend){
        this.setState({
          friend_status: "Friend"
        });
      }else{
        this.setState({
          friend_status: "Friend request"
        });
      }
    }
    render() {
      return(
        &lt;button className="friend-request-button"&gt;{this.state.friend_status == "Friend" ? &lt;i className="fa fa-check"&gt;&lt;/i&gt; : &lt;i className="fa fa-user-plus"&gt;&lt;/i&gt;}{this.state.friend_status}&lt;/button&gt;
      );
    }
  }
  
  export default FriendButton;
  </code></pre>
  
  <p>Now as you can see I am logging the <code>props</code> in the <code>componentWillMount()</code> and the logg that I receive is : <code>Friend status at friend button:  Object {is_friend: false}</code></p>
  
  <p>When I inspect my component in GoogleChrome React Tools I can clearly see that this property is set to <code>true</code> as you can see in the following image.</p>
  
  <p><a href="https://i.stack.imgur.com/5nvET.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/5nvET.png" alt="enter image description here"></a></p>
  
  <p>This has never happened to me before - any ideas what I might be missing here?</p>