title: Assigning state to props from redux does not work
body: <pre><code>import React, { Component } from 'react';
  import DisplayTable from './Table.js';
  
  class App extends Component {
    constructor(props) {
     super(props);
     this.state = {
       menuItems: this.props.menu_items,
       searchString: '',
       displayItems: this.props.menu_items
     }
   this.search = this.search.bind(this);
   this.handleChange = this.handleChange.bind(this);
  }
  
  componentWillMount() {
     this.props.get_menu_items_api(false);
   }
  
  componentWillReceiveProps(nextProps) {
     this.setState({ menuItems: nextProps.menu_items })
  }
  
  handleChange(e, isEnter) {
   const searchData = () =&gt; {
    let tempMenuProductDetails = this.props.menu_items;
    const filterArray = tempMenuProductDetails.reduce((result, category) =&gt; {
      if (category.categoryName.toLowerCase()
     .indexOf(this.state.searchString.toLowerCase()) &gt; -1) {
        result.push(category);
      }
      if (category.productList &amp;&amp; category.productList.length &gt; 0) {
        category.productList = category.productList.reduce((productListResult, 
        productList) =&gt; {
          if (!!productList.productName &amp;&amp; 
              productList.productName.toLowerCase()
             .indexOf(this.state.searchString.toLowerCase()) &gt; -1)
          {
            productListResult.push(productList);
          }
          return productListResult;
        }, []);
      }
  
      return result;
      }, []);
       this.setState({
       displayItems: filterArray
     }, function () {
      console.log(this.state.displayItems);
     })
     console.log(filterArray);
     }
     if (!isEnter) {
      this.setState({
       searchString: e.target.value
    });
    } else {
    searchData();
   }
    }
  
   search(e) {
    if (e.keyCode == 13) {
    this.handleChange(e, true);
   }
    this.handleChange(e, false);
   }
  
   render() {
     console.log(this.state.displayItems);
     console.log(this.props.menu_items);
     console.log(this.state.menuItems);
     return (
        &lt;DisplayTable dataProp={this.state.displayItems} editFuncProp=
         {this.props.edit_menu_items_api} /&gt;  )
           }
     }
  
    export default App;
  </code></pre>
  
  <hr>
  
  <p>I have this search function in this file that does not update the value of props coming from the container of redux. Now when I pass {this.state.displayItems} in menu ,it does not display the data.</p>
  
  <hr>
  
  <p>But when I pass {this.props.menu_items} it displays the data and I am not able to modify this.props.menu_items on the basis of search.
  I have tried this code . what should i do?</p>
  
  <p><a href="https://i.stack.imgur.com/QKFKh.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/QKFKh.png" alt="This is the console."></a></p>