这是我的解决方案键盘解散和滚动到点击TextInput(我使用的是ScrollView与keyboardDismissMode道具):

import React from 'react';
import {
  Platform,
  KeyboardAvoidingView,
  ScrollView
} from 'react-native';

const DismissKeyboard = ({ children }) => {
  const isAndroid = Platform.OS === 'android';
  const behavior = isAndroid ? false : 'padding';

  return (
    <KeyboardAvoidingView
      enabled
      behavior={ behavior }
      style={{ flex: 1}}
    >
      <ScrollView
        keyboardShouldPersistTaps={'always'}
        keyboardDismissMode={'on-drag'}
      >
        { children }
      </ScrollView>
    </KeyboardAvoidingView>
  );
};

export default DismissKeyboard;

用法:

render(){
   return(
     <DismissKeyboard>
       <TextInput
        style={{height: 40, borderColor: 'gray', borderWidth: 1}}
        onChangeText={(text) => this.setState({text})}
        value={this.state.text}
      />
     </DismissKeyboard>
   );
}

如果我没有弄错的话，最新版本的React Native已经解决了这个问题，可以通过敲击键盘来消除键盘。

将组件包装在TouchableWithoutFeedback中可能会导致一些奇怪的滚动行为和其他问题。我更喜欢用onStartShouldSetResponder属性填充在视图中包装我最顶层的应用程序。这将允许我处理所有未处理的触摸，然后解散键盘。重要的是，由于handler函数返回false，所以触摸事件会像正常情况一样向上传播。

 handleUnhandledTouches(){
   Keyboard.dismiss
   return false;
 }

 render(){
    <View style={{ flex: 1 }} onStartShouldSetResponder={this.handleUnhandledTouches}>
       <MyApp>
    </View>
  }

这刚刚被更新和记录!不再有隐藏的诡计。

import { Keyboard } from 'react-native'

// Hide that keyboard!
Keyboard.dismiss()

Github链接

在ScrollView中使用

keyboardShouldPersistTaps="handled" 

这个可以帮到你。

我是React的新手，在制作演示应用程序时遇到了完全相同的问题。如果你使用onStartShouldSetResponder道具(此处描述)，你可以在一个普通的旧React. view上抓取触摸。很想听听更多经验丰富的反应者对这一策略的看法/如果有更好的策略，但这对我来说是有效的:

containerTouched(event) {
  this.refs.textInput.blur();
  return false;
}

render() {
  <View onStartShouldSetResponder={this.containerTouched.bind(this)}>
    <TextInput ref='textInput' />
  </View>
}

这里需要注意两点。首先，正如这里讨论的，还没有结束所有子视图编辑的方法，所以我们必须直接引用TextInput来模糊它。其次，onStartShouldSetResponder被它上面的其他可触摸控件截获。因此，在容器视图中点击TouchableHighlight等(包括另一个TextInput)将不会触发事件。但是，在容器视图中单击Image仍然会关闭键盘。