React native - ScrollView 在 android 中不工作

Question

我在 flex 中的 react-native 中使用了我的 scrollview，它在 web 上工作但在我的 android phone

上不起作用

这是我的代码-

  render() {
    return (
      <View style={styles.root}>
        <ScrollView contentContainerStyle={{flex: 1 }}>
          <View style={styles.box1} >
          </View>
          <View style={[styles.box2, { height: this.state.height }]} />
          <View style={styles.box1} >
               <TouchableOpacity onPress={() => this.setState({ height: this.state.height + 50 })}>
              <Text>Click me to grow the purple section</Text>
            </TouchableOpacity>
          </View>
        </ScrollView>
      </View>
    );
  }
}

这是我的样式表 -

const styles = StyleSheet.create({
  root: {
    flex: 1,
    flexDirection: 'column',
    backgroundColor: '#fff',
  },
  box1: {
    height: 200,
    backgroundColor: 'blue'
  },
  box2: {
    height: 200,
    backgroundColor: 'purple'
  }
});

Answer 1

尝试从 contentContainerStyle 中删除属性 flex: 1。如果需要 flex，您可以选择 flexGrow: 1 而不是 flex.

有关 contentContainerStyle

的更多信息

React native - ScrollView 在 android 中不工作

React native - ScrollView not working in android

scrollview

flexbox

react-native