如果你有keyboardType='numeric'，键盘不解除的问题会变得更严重，因为没有办法解除它。

用 ScrollView 替换 View 不是一个正确的解决方案，就好像你有多个textInputs 或buttons，在键盘打开时点击它们只会关闭键盘。

正确的方法是封装View withTouchableWithoutFeedback并调用Keyboard.dismiss()

编辑：您现在可以使用ScrollViewwithkeyboardShouldPersistTaps='handled'仅在孩子未处理点击时关闭键盘（即点击其他文本输入或按钮）

如果你有

<View style={{flex: 1}}>
    <TextInput keyboardType='numeric'/>
</View>

将其更改为

<ScrollView contentContainerStyle={{flexGrow: 1}}
  keyboardShouldPersistTaps='handled'
>
  <TextInput keyboardType='numeric'/>
</ScrollView>

或者

import {Keyboard} from 'react-native'

<TouchableWithoutFeedback onPress={Keyboard.dismiss} accessible={false}>
    <View style={{flex: 1}}>
        <TextInput keyboardType='numeric'/>
    </View>
</TouchableWithoutFeedback>

编辑：您还可以创建一个高阶组件来关闭键盘。

import React from 'react';
import { TouchableWithoutFeedback, Keyboard, View } from 'react-native';

const DismissKeyboardHOC = (Comp) => {
  return ({ children, ...props }) => (
    <TouchableWithoutFeedback onPress={Keyboard.dismiss} accessible={false}>
      <Comp {...props}>
        {children}
      </Comp>
    </TouchableWithoutFeedback>
  );
};
const DismissKeyboardView = DismissKeyboardHOC(View)

像这样简单地使用它

...
render() {
    <DismissKeyboardView>
        <TextInput keyboardType='numeric'/>
    </DismissKeyboardView>
}

注意：accessible={false}需要使输入表单继续可通过 VoiceOver 访问。视障人士会感谢你！

这刚刚得到更新和记录！没有更多隐藏的技巧。

import { Keyboard } from 'react-native'

// Hide that keyboard!
Keyboard.dismiss()

Github 链接

将此用于自定义解雇

var dismissKeyboard = require('dismissKeyboard');

var TestView = React.createClass({
    render: function(){
        return (
            <TouchableWithoutFeedback 
                onPress={dismissKeyboard}>
                <View />
            </TouchableWithoutFeedback>
        )
    }
})

使用 React Native Keyboard.dismiss()

更新答案

React Native 在 上暴露了静态dismiss()方法Keyboard，所以更新的方法是：

import { Keyboard } from 'react-native'; 

Keyboard.dismiss()

原答案

使用 React Native 的dismissKeyboard库。

我有一个非常相似的问题，我觉得我是唯一一个没有得到它的人。

滚动视图

如果您有 aScrollView或任何从它继承的东西，例如 a ListView，您可以添加一个props，该props将根据按下或拖动事件自动关闭键盘。

props是keyboardDismissMode并且可以具有none,interactive或的值on-drag。您可以在此处阅读更多相关信息。

常规观看次数

如果您有除 a 之外的其他东西，ScrollView并且您希望按下任何按钮来关闭键盘，您可以使用一个简单的TouchableWithoutFeedback并onPress使用 React Native 的实用程序库dismissKeyboard来为您关闭键盘。

在您的示例中，您可以执行以下操作：

var DismissKeyboard = require('dismissKeyboard'); // Require React Native's utility library.

// Wrap your view with a TouchableWithoutFeedback component like so.

<View style={styles.container}>

  <TouchableWithoutFeedback onPress={ () => { DismissKeyboard() } }>

    <View>

      <Text style={styles.welcome}>
        Welcome to React Native!
      </Text>

      <Text style={styles.instructions}>
        To get started, edit index.ios.js
      </Text>

      <Text style={styles.instructions}>
        Press Cmd+R to reload,{'\n'}
        Cmd+D or shake for dev menu
      </Text>

      <TextInput style={{height: 40, borderColor: 'gray', borderWidth: 1}} />

    </View>

  </TouchableWithoutFeedback>

</View>

注意：TouchableWithoutFeedback只能有一个孩子，所以你需要把它下面的所有东西都包装成一个单一的，View如上图所示。

简单的答案是使用 ScrollView 而不是 View 并将 scrollable 属性设置为 false （尽管可能需要调整一些样式）。

这样，当我点击其他地方时，键盘就会消失。这可能是 react-native 的问题，但点击事件似乎只能用 ScrollViews 处理，这会导致所描述的行为。

编辑：感谢 jllodra。请注意，如果您直接点击另一个 Textinput 然后点击外部，键盘仍然不会隐藏。