title: React trying to assign props to state variable doesn't work
body: <p>I'm trying to assign props that I get from parent component and assign it to state in child component(because I want to manipulate the props data I assign it to state first).</p>
  <p>When I log the state variable it comes out as an empty array but when I make a new variable in render and assign props to it and log it. It does show the data I need. Also, when I just log <code>this.props</code> I can definitely see that props holds the data I need.</p>
  <p>I've assigned props to state a couple of times before, so I'm not sure what is so different this time for it not to work.</p>
  <p>Parent component where I pass props to child:</p>
  <pre><code>  &lt;ShowAvailableTimeslots onClick={this.getSelectedTimeslot} allTimeSlots={this.state.AvailabletimeSlots} /&gt; 
  
  </code></pre>
  <p>Child component where I try to assign props to state:</p>
  <pre><code>class ShowAvailableTimeslots extends Component {
      constructor(props) {
        super(props)
          this.state = {
              sliceEnd: 5,
              sliceStart:0,
              selectedSlotValue: &quot;&quot;,
              timeSlotArr: this.props.allTimeSlots,
              // timeSlotSlice: timeSlotArr.slice(this.state.sliceStart, this.state.sliceEnd)
          }
        
      }
  
      handleTimeSlotClick = (timeSlot) =&gt; {
          this.setState({ selectedSlotValue: timeSlot }, () =&gt; {
              this.props.onClick(this.state.selectedSlotValue)
              console.log('time slot value', timeSlot)
            
          });
      }
      previousSlots =()=&gt;{
          var test;
      }
      forwordSlots =()=&gt;{
          var test;
      }    
  
      
      render() {
           var timeSlotArrRender = this.props.allTimeSlots; 
          return (
              &lt;React.Fragment&gt;
  
                  {console.log(&quot;state&quot;, this.state.timeSlotArr)} // --&gt; doesn't show data
                  {console.log(&quot;props&quot;, this.props)} // --&gt; does show data
                  {console.log(&quot;render variable&quot;, timeSlotArrRender )} // --&gt; does show data
  
  
                  &lt;button className=&quot;button btn&quot; onClick={() =&gt; this.previousSlots()} disabled={this.state.sliceStart === 0}&gt;left&lt;/button&gt;
                  {/* {this.state.timeSlotArr.map(timeSlot =&gt; &lt;a className=&quot;timeslot btn &quot; key={timeSlot} value={timeSlot} onClick={() =&gt; this.handleTimeSlotClick(timeSlot)}&gt;{timeSlot}&lt;/a&gt;)
                  } */}
                  &lt;button className=&quot;button btn&quot;&gt;right&lt;/button&gt;
  
              &lt;/React.Fragment&gt;
          )
      }
  }
  
  export default ShowAvailableTimeslots
  </code></pre>