React Native - ScrollView 不滾動

Question

我目前正在使用 React Native 制作注冊表單。 當我在應用程序中實現時，滾動條不起作用。

return (
    <TouchableWithoutFeedback
      onPress={() => {
        Keyboard.dismiss();
      }}>
      <View style={styles.container}>
        <ScrollView>
          <View style={styles.formContainer}>
            <View style={styles.registerTextContainer}>
              {/* <Text style={styles.registerText}>Register for an account</Text> */}
            </View>

            <Form type={User} ref={c => (this._form = c)} options={options} />

            <TouchableOpacity
              style={styles.registerButtonContainer}
              onPress={this.handleSubmit}>
              <Text style={styles.registerButtonText}>REGISTER</Text>
            </TouchableOpacity>
          </View>
        </ScrollView>
      </View>
    </TouchableWithoutFeedback>
  );
}

這是應用程序當前的外觀

Answer 1

嘗試使用 ScrollView 而不是 TouchableWithoutFeedback 包裝整個頁面並將 flex 設置為 1

 return (
<ScrollView style={{ flex: 1 }}>
  <TouchableWithoutFeedback
    onPress={() => {
      Keyboard.dismiss();
    }}
  >
    <View style={styles.container}>
      <View style={styles.formContainer}>
        <View style={styles.registerTextContainer}>
          {/* <Text style={styles.registerText}>Register for an account</Text> */}
        </View>

        <Form type={User} ref={(c) => (this._form = c)} options={options} />

        <TouchableOpacity
          style={styles.registerButtonContainer}
          onPress={this.handleSubmit}
        >
          <Text style={styles.registerButtonText}>REGISTER</Text>
        </TouchableOpacity>
      </View>
    </View>
  </TouchableWithoutFeedback>
</ScrollView>

);

Answer 2

不要在滾動視圖中設置 flex:1，而是嘗試

<ScrollView contentContainerStyle={{ flexGrow: 1}}>