title: React .trim() is not a function
body: <p>My application has a landing page with two components in two separate tabs.</p>
  
  <p>The code from the first component that is causing the crash looks like this: </p>
  
  <pre><code>for (let key in linegraphdata) {
    linegraphdata[key].price = Number(
      linegraphdata[key].price.trim().slice(1)
    );
    linegraphdata[key].month = parseDate(linegraphdata[key].month);
  }
  </code></pre>
  
  <p>When I load into my application initially it doesn't crash, loads the data from the first tab fine. I'll click into the second tab and when I eventually click back the whole application crashes and the log gives me this error: </p>
  
  <pre><code>Uncaught TypeError: linegraphdata[key].price.trim is not a function
  </code></pre>
  
  <p>It must have something to do with how React handles refreshing components once already rendered, could anyone help me figure it out please :) </p>