在我的本机反应代码中，keyboardavoiding 视图不起作用

Question

我很烦恼。在我的代码中，keyboardavoiding 视图不起作用。我正在使用键盘避免查看，但是当我填写确认密码时，textInput 将位于键盘后面并且不显示。请为我的 code.my 代码建议更好的答案是：-

<SafeAreaView style={{ flex: 1 }}>
    <View>
        <View>
            <Image source={require('../img/LykaLogo.png')} style={{ width: 100, height: 100 }} />

        </View>
    </View>
    <View >
    <KeyboardAvoidingView behavior='padding'>
        <View>
            <Text style={{fontSize:15,}}>CREATE USER ACCOUNT</Text>
        </View>
        <View >
        <View >
        <TextInput
                placeholder='FULL NAME'
                inputStyle={{fontSize:15}}               
            />
        </View>
        <View >
        <TextInput
                placeholder='USERNAME'
                inputStyle={{fontSize:15}}               
            />
        </View>
        <View >
        <TextInput
                placeholder='EMAIL'
                inputStyle={{fontSize:15}}               
            />
        </View>
        <View >
        <TextInput
                placeholder='PHONE'
                inputStyle={{fontSize:15}}               
            />
        </View>
        <View >
        <TextInput
                placeholder='PASSWORD'
                inputStyle={{fontSize:15}}               
            />
        </View>
        <View>
        <TextInput
                placeholder='CONFIRM  PASSWORD'
                inputStyle={{fontSize:15}}               
            />
        </View>
        </View>
        </KeyboardAvoidingView>
    </View>
</SafeAreaView>

Answer 1

我建议您根本不要将 KeyboardAvoidingView 用于 Android，Android 中的默认键盘行为就足够了。

这是一个如何操作的例子：

import { Platform } from 'react-native';

...

renderContent() {
  return (
    <View>
      ...
    </View>
  )
}

render() {
  return (
    <View>
      {Platform.OS === 'android' ? this.renderContent() :
        <KeyboardAvoidingView behavior='padding' enabled>
          {this.renderContent()}
        </KeyboardAvoidingView>}
    </View>
  );
}

一个可能也适用于您的更简短的解决方案是不为 Android 设置 behavior 属性。仅为 iOS:

设置

import { Platform } from 'react-native';

...

render() {
  return (
    <View>
      <KeyboardAvoidingView behavior={Platform.OS === 'android' ? '' : 'padding'} enabled>
        ...
      </KeyboardAvoidingView>
    </View>
  );
}

这是关于 KeyboardAvoidingView 的 behavior 属性的官方文档：

Android and iOS both interact with this prop differently. Android may behave better when given no behavior prop at all, whereas iOS is the opposite.

Source

在我的本机反应代码中，keyboardavoiding 视图不起作用

In My react-native code the keyboardavoiding view is not working

android

tpkeyboardavoiding

react-native