反應原生滾動視圖根本不滾動

我正在構建一個 react native 應用程式，我對某些內容使用了 scrollview，但它沒有滾動，我不知道為什么。我嘗試了很多東西，flex: 1到處添加，但這些都不起作用。

預先感謝您的幫助。

<KeyboardAwareScrollView contentContainerStyle={authStyles.container}>
          <Layout isBackArrow={true}>
              <BottomLayout>
                  <Header fontSize={20}>
                      <Text>Nous sommes</Text> {'\n'}
                      <Text style={authStyles.headerBold}>
                          Ravis de te revoir!
                      </Text>
                      {'\n'}
                      <Caption>Je me connecte via:</Caption>
                  </Header>
                  <View style={authStyles.socialIconView}>
                      <SocialIcon type="facebook" onPress={onFacebookLogin} />
                      <SocialIcon type="google" />
                      <SocialIcon
                          type="apple"
                          onPress={onAppleButtonPress}
                          style={{ backgroundColor: COLORS.BLACK }}
                      />
                  </View>
                  <View style={authStyles.orView}>
                      <Header fontSize={15}>
                          <Text style={authStyles.headerBold}>Ou</Text>
                          {'\n'}
                          <Caption>
                              Je saisis mon email et mot de passe
                          </Caption>
                      </Header>
                  </View>
                  <View style={authStyles.inputView}>
                      <CustomInput
                          label="Email"
                          icon
                          iconName="envelope"
                          iconFamily="font-awesome"
                          onChange={text => setEmail(text)}
                      />
                      <CustomInput
                          label="Mot de passe"
                          icon
                          iconName="lock"
                          iconFamily="entypo"
                          onChange={text => setPassword(text)}
                          password
                      />
                      <CustomButton
                          title="Mot de passe oublié ?"
                          clear
                          onPress={open}
                      />
                  </View>
              </BottomLayout>
          </Layout>
      </KeyboardAwareScrollView>

布局組件：

<View style={layoutStyles.background}>
            {isBackArrow && <BackArrow onPress={onBackArrowPress} />}
            <ScrollView
                style={{ flex: 1 }}
                contentContainerStyle={{
                    flex: 1,
                }}
            >
                {children}
            </ScrollView>
        </View>

布局樣式：

background: {
        backgroundColor: COLORS.BRAND_ORANGE_OPACITY_2,
        width: '100%',
        height: '100%',
        flex: 1,
    },

底部布局組件：

<View style={layoutStyles.bottomLayout}>{children}</View>;

底部布局樣式：

bottomLayout: {
        backgroundColor: COLORS.BRAND_ORANGE,
        position: 'absolute',
        bottom: 0,
        height: '75%',
        width: '100%',
        borderTopLeftRadius: 70,
        borderTopRightRadius: 70,
        paddingTop: 60,
        flex: 1,
    },

keyboardAwareScrollView contentContainerStyle:

container: {
       justifyContent: 'center',
       alignItems: 'center',
       flex: 1,
   },

提前致謝。

uj5u.com熱心網友回復：

KeyboardAwareScrollView 已經為您提供了一個 ScrollView，您不需要在其中添加另一個。從 Layout 中洗掉 ScrollView 或洗掉 KeyboardAwareScrollView。

React Native Nested ScrollView 無法在 Android 設備上滾動

也不要使用flex: 1in contentContainerStyle，而是使用minHeight: '100%'（為什么？），如果您希望它全屏顯示，即使其中沒??有足夠的內容。

標籤：安卓 反应原生 反应原生滚动视图

上一篇：當我使用onPress時，我想同時設定這兩個狀態

下一篇：如何在反應原生中添加顯示更多和顯示更少按鈕并根據它們渲染專案