title: React Native Dynamic Styling
body: <p>I am creating s crypto app where I want to change background color to red when the price went down and green when Price went up and then after 2 seconds change the background back to normal using setTimeout. </p>
  
  <p>I tried two different methods to at-least change the backgroundColor but on both the occasion i got the following error </p>
  
  <blockquote>
    <p>You attempted to set the key backgroundColor with the value  #ffe5e5
    on an object that is meant to be immutable and has been frozen.</p>
  </blockquote>
  
  <p>I asked the <a href="https://stackoverflow.com/questions/51820659/react-native-you-attempted-to-set-the-key-on-an-object-that-is-meant-to-be-immu/51820969#51820969">separate question for the same</a> but for some reason, the response I received was not convincing. </p>
  
  <p>Afterwords, i tried a different approach (the one which does not allow the use of StyleSheet) but I still got the same error. </p>
  
  <p>I am putting my new code here (you can refer to my previous code from the question) </p>
  
  <p>First I declared an object in a global scope like this </p>
  
  <pre><code>var upperRow = {
      display: "flex",
      flexDirection: "row",
      marginBottom: 5, 
      backgroundColor: "white"
  } 
  
  
  class  CoinCard extends Component {
  </code></pre>
  
  <p>then I tried to change background color like this </p>
  
  <pre><code>  componentWillReceiveProps(nextProps) {
  
      if (this.props.coinPrice != nextProps.coinPrice ) {
         if (this.props.coinPrice &gt; nextProps.coinPrice) {
  
             upperRow["backgroundColor"] = "#ffe5e5";
   }
  }
  </code></pre>
  
  <p>followed by assigning the styles like this </p>
  
  <pre><code>return (
  
      &lt;View style={container}&gt;
  
              &lt;View style={upperRow}&gt;
  </code></pre>
  
  <p><strong>[Question:]</strong> How can I change the styling dynamically? </p>