title: Getting error "TypeError: rangeValue.replace is not a function" when attempting to animate using React-Spring
body: <p>I am trying to animate an h1 when a variable becomes true. </p>
  
  <p>Here is some code:</p>
  
  <pre><code>  const styles = useSpring({
      from: {opacity: 0},
      enter: {opacity: 1}
    })
    return (
           &lt;Toggle&gt; // this is a component I have built, it has a function in it called toggle, which sets 
                       on to true or false.
              {({on, toggle}) =&gt; (
                &lt;Fragment&gt;
                  &lt;button onClick={toggle}&gt;Spring&lt;/button&gt;
                  {(styles) =&gt; (
                    &lt;Fragment&gt;
                      {on &amp;&amp; &lt;animated.h1 style={{...this.styles}}&gt;i will fade in&lt;/animated.h1&gt;}
                    &lt;/Fragment&gt;
                  )}
                &lt;/Fragment&gt;
              )}
            &lt;/Toggle&gt;
  </code></pre>
  
  <p>I have read the docs but can't find a solution.</p>