Javascript ScrollView不使用ImageBackground组件一直向下滚动

出于某种原因，当我在ScrollView中使用imageBackgrounds作为项目列表时，它不会一直向下滚动，只会稍微移动一点。以下是对这个问题的分析。这是React Native 16.13.1。当我将ImageBackgrounds替换为文本组件时，ScrollView工作得很好

  <ScrollView>
     <View style={styles.menuItem}>
          <ImageBackground style={styles.imageBkg} source={Images[props.imgType]}>
            <Text style={styles.label}>{props.children}</Text>
            <View style={styles.overlay} />
          </ImageBackground>
      </View>
    
    <View style={styles.menuItem}>
          <ImageBackground style={styles.imageBkg} source={Images[props.imgType]}>
            <Text style={styles.label}>{props.children}</Text>
            <View style={styles.overlay} />
          </ImageBackground>
    </View>

  <View style={styles.menuItem}>
              <ImageBackground style={styles.imageBkg} source={Images[props.imgType]}>
                <Text style={styles.label}>{props.children}</Text>
                <View style={styles.overlay} />
              </ImageBackground>
        </View>
    
    <View style={styles.menuItem}>
          <ImageBackground style={styles.imageBkg} source={Images[props.imgType]}>
            <Text style={styles.label}>{props.children}</Text>
            <View style={styles.overlay} />
          </ImageBackground>
    </View>
 </ScrollView>


const styles = StyleSheet.create({
  menuItem: {
    height: 180,
    marginVertical: 5,
    backgroundColor: "blue",
  },
  imageBkg: {
    width: "100%",
    height: "100%",
    flexDirection: "column",
    justifyContent: "flex-end",
  },
  label: {
    elevation: 2,
    fontSize: 36,
    paddingLeft: "5%",
    paddingVertical: "2%",
    color: "white",
    backgroundColor: "rgba(0,0,0,0.5)",
  },
  overlay: {
    ...StyleSheet.absoluteFillObject,
    backgroundColor: "rgba(37, 136, 37, .5)",
  },
});

{props.children}
{props.children}
{props.children}
{props.children}
const styles=StyleSheet.create({
菜单项：{
身高：180，
第五名：，
背景颜色：“蓝色”，
},
imageBkg：{
宽度：“100%”，
高度：“100%”，
flexDirection:“列”，
辩护内容：“柔性端”，
},
标签：{
标高：2，
尺寸：36，
填充左：“5%”，
垂直填充：“2%”，
颜色：“白色”，
背景色：“rgba（0,0,0,0.5）”，
},
覆盖：{
…StyleSheet.absoluteFillObject，
背景色：“rgba（37，136，37，5）”，
},
});

我已经看到了导致您的问题的两个可能原因，第一个是您的菜单项样式。您可能希望将其更改为在图像上动态调整，在这种情况下，请使用“flex:1”，不要将其设置为180的静态高度。第二种是imageBkg样式，您可能希望在这里将高度静态设置为180

注:

在某些情况下，您可能不想使用ImageBackground，因为实现是基本的。基于react原生文档

---

从长远来看，使用FlatList而不是ScrollView也会对您有所帮助，并且

感谢您的输入。您建议使用Image而不是ImageBackground，这使我获得了正确的配置，使其正常工作