title: ScrollView minHeight to take up all the space
body: <p>I have a <code>ScrollView</code> which content doesn't necessarily exceeds it's size. Let's say it's a form where, upon errors, it expands to add error messages and then it exceeds the <code>ScrollView</code> size and thus is why I'm using that scroll.</p>
  
  <p>The thing is that I want the content to always be at least of the same size of the ScrollView. I'm aware of the <code>minHeight</code> property, but the only way I found to use it is re-rendering, which I'd like to avoid.</p>
  
  <p>I'm using redux for state management and this is what I have</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;ScrollView
    contentContainerStyle={[ownStyles.container, {minHeight: this.props.scrollHeight}]}
    style={this.props.style}
    showsVerticalScrollIndicator={false}
    onLayout={(event) =&gt; {
      scrollHeight = event.nativeEvent.layout.height;
      this.props.setScrollContentHeight(scrollHeight);
    }}
  &gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>Where the <code>this.props.setScrollContentHeight</code> triggers an action which enters the height on the state, and <code>this.props.scrollHeight</code> is said height. So that after the first render where the onLayout function is triggered, the state is updated with the ScrollView's <code>height</code>, which I then assign as <code>minHeight</code> to its content.</p>
  
  <p>If I set the content's style to <code>flex: 1</code> then the ScrollView won't scroll.</p>
  
  <p>Can you think of a way to avoid that second render for performance purposes?</p>
  
  <p>Thank you!</p>