React-native如何在键盘上方向上移动Textfield答案

【问题标题】：React-native how to move up Textfield above keyboardReact-native如何在键盘上方向上移动Textfield
【发布时间】：2019-06-12 17:28:37
【问题描述】：

我试图在显示键盘时向上移动文本字段。我在 react native 应用程序中做登录屏幕，所以，我添加了Scrollview。

但是，它适用于所有设备的滚动。但是，我只需要 iPhone 5s 设备。

即使我尝试使用KeyboardAvoidingView，但是，由于这整个数据是重叠的。

有什么建议可以避免这个问题？

【问题讨论】：

如果你有集成本地库的知识，那么你可以使用这个github.com/douglasjunior/react-native-keyboard-manager 它会自动处理从你的键盘上滚动的内容，在 IOS 和 android 上你可以放这个 (android:windowSoftInputMode="adjustResize" ) 在清单上的活动标签上。
我安装并导入后尝试使用它 componentDidMount() { KeyboardManager.setEnable(true); KeyboardManager.setToolbarPreviousNextButtonEnable(true); } //但是会显示类似 setEnable undefined 的错误。
只安装是不行的。你必须将它与你的 react native 项目链接起来，因为它是一个本地库，这里的链接显示了它是如何完成的。 facebook.github.io/react-native/docs/linking-libraries-ios.html
我已经链接了
他们只是告诉安装和链接。就是这样

标签： node.js react-native keyboard scrollview

【解决方案1】：

您必须使用 KeyboardAvoidingView 但不能与滚动视图一起使用，因为滚动视图没有高度。如果您必须使用没有滚动视图的 KeyboardAvoidingView，并且如果您使用的是滚动视图，那么您可以自动向上滚动并查看文本字段

【讨论】：

KeyboardAvoidingView 如果我使用这个，底部的文字会在登录屏幕中重叠。
发布截图
还要注意将KeyboardAvoidingView放在哪里..放在textfield的视图下方
我已经像这样添加了
。尝试这个。就在文本字段上方

【解决方案2】：

对于仍在寻找的人：对于内容上的任何输入字段，有 2 个库有助于获得最佳结果。

'react-native-keyboard-aware-scrollview';
'react-native-keyboard-tracking-view';

只需导入以下内容：

   import {KeyboardAwareScrollView} from 'react-native-keyboard-aware-scrollview';
   import {KeyboardAwareInsetsView} from 'react-native-keyboard-tracking-view';

你的渲染方法应该是这样的：

public render(): JSX.Element {
    return (
       <View style={{flex: 1}}>
       <KeyboardAwareScrollView style={{flex: 1}} keyboardShouldPersistTaps={'always'}>
          {this.renderInputContent()}
        </KeyboardAwareScrollView>
        {this.renderCTA()}
        <KeyboardAwareInsetsView/>
       <View/>

    );
  }

【讨论】：