ScrollView cannot scroll when having View components inside of it

Question

I am using React Native:
I have a components called inside of a ScrollView :

function SomeScreen(){

    return(

        <ScrollView style={myStyles.someStyles}>

            <View>
                <Text style={myStyles.homeHeroTitle}>Hello Tom</Text>
                <Text>It's great seeing you!</Text>
            </View>


            <View>
                <Text>SomeText</Text>
            </View>
            
            <View>
                <Text>SomeOtherText</Text>
            </View>
    
        </ScrollView>   
    );
    
}


let myStyles = StyleSheet.create({
   someStyles:{
      width: "100%",
      height: "100%",
      
   },
});

I cannot scroll in the ScrollView, when I am calling other View elements inside of the ScrollView.

But, I can scroll when the only elements inside of the ScrollView are the Text element.

Answer 1

在滚动视图的样式中使用 flex:1 并尝试为滚动添加更多文本（添加数据）。

Answer 2

Firstly, try to avoid so many Views as Text also have properties of View which you can use.

Secondly, you can give styling to ScrollView as

someStyles:{
flex:1
}

It depends on, from where you imported ScrollView.Is it from react-native or react-native-gesture-handler?

import { ScrollView } from 'react-native';
import { ScrollView } from 'react-native-gesture-handler';