title: How to update state in React before every component render?
body: <p>I have a React component that looks like this:</p>
  
  <pre><code>class MyComp extends Component {
      constructor(props) {
          super(props);
  
          this.state = {
              myObject: this.props.myObject,
          };
  
          this.updateState = this.updateState.bind(this);
      }
  
      componentWillMount() {
          this.updateState();
      }
  
      updateState() {
          // removed for brevity, doing some calculations here
          // based on some data that is stored in Redux and is 
          // passed here as props.
  
          this.setState({
              myObject: newObject
          });
      }
  
      render() {
          return (
              // removed for brevity, renders some HTML elements
          );
      }
  }
  
  MyComp.propTypes = {
      myObject: PropTypes.object.isRequired,
      // some other props
  };
  
  export default MyComp;
  </code></pre>
  
  <p>The point is that I'm using Redux also, and when certain buttons are clicked on the rendered component, I update some state in the Redux, and the update works all fine. And afterwards based on the updated Redux state, I want to update the state of the <code>MyComp</code> component, which initially gets the state as a prop, though that object is not maintained in the Redux, but instead is a state of another component and it is passed to <code>MyComp</code> as a prop. </p>
  
  <p>I simply want to update state before each render of the above component. But this doesn't seem to work. Although my data in the Redux is updated and works all fine, calling <code>componentWillMount</code> like this to update my local state, does not seem to work. What I have observed is that it calls my <code>updateState</code> function just one, it is not called in every re-render. Any ideas how to update the state before every render call?</p>