Javascript 滚动查看最小高度以占用所有空间

我有一个

滚动视图

，它的内容不一定超过它的大小。假设它是一个表单，在出现错误时，它会扩展以添加错误消息，然后它会超过

ScrollView

的大小，这就是我使用该滚动的原因

问题是，我希望内容始终至少与ScrollView大小相同。我知道

minHeight

属性，但我发现使用它的唯一方法是重新渲染，这是我想要避免的

我正在使用redux进行状态管理，这就是我所拥有的

{
scrollHeight=event.nativeEvent.layout.height；
this.props.setScrollContentHeight（滚动高度）；
}}
>

我知道这有点晚了，但我认为用

视图

和

最小高度

样式属性将

滚动视图

中的内容包装起来就可以了。

你应该在滚动视图中使用

flexGrow:1

，在滚动视图中使用

flex:1

，获取一个可滚动但至少尽可能大的

---

这是一个很好的主意。

这已经有很长时间了，但我也在为同样的问题而挣扎。简单的方法是在scrollView的

style

和

contentContainerStyle

道具上使用

flexGrow:1

而不是

flex:1

。内容将占用至少100%的空间，如果需要，还将占用更多空间

实现这一点的两个解决方案是：

• 在

  滚动视图上使用
  minHeight
  （但这需要考虑屏幕尺寸才能正确渲染）

• 在

  ScrollView

  contentContainerStyle

  上使用

  flexGrow:1

  ，在内部内容上使用

  flex:1

  ：

...

我想与大家分享我的解决方案，对我来说，这些都不管用。我也不能在那里发表评论，因为facebook阻止了这个帖子

基本上，我的解决方案是在

ScrollView

组件上的

contentContainerStyle

中设置

flexGrow:1

，并将所有内容包装在

View

组件中，其中的

height

属性根据屏幕大小进行设置。下面是示例代码：

import { Dimensions } from "react-native";

let screenHeight = Dimensions.get('window').height;

<ScrollView contentContainerStyle={{ flexGrow: 1 }}>
   <View style={{height: screenHeight}}>
    ... your content here ...
   </View>
</ScrollView>

从“react native”导入{Dimensions}；
让屏幕高度=尺寸。获取（'window'）。高度；
... 你的内容在这里。。。

你的内容

---

这对我很有效。

并且使用

身高：100%不起作用？请参考：这是唯一有效的组合！谢谢！然而，
contentContainerStyle
对我来说已经足够了。请注意，对于ScrollView，您不能直接使用样式，而是使用contentContainerStyle:

import { Dimensions } from "react-native";

let screenHeight = Dimensions.get('window').height;

<ScrollView contentContainerStyle={{ flexGrow: 1 }}>
   <View style={{height: screenHeight}}>
    ... your content here ...
   </View>
</ScrollView>


<ScrollView contentContainerStyle={{ flexGrow: 1 }}>
  <View style={{ flexGrow: 1 }}>
    Your content
  </View>
</ScrollView>