如果我点击一个文本输入,我希望能够点击其他地方,以便再次取消键盘(不是返回键)。在我读过的所有教程和博客文章中,我没有发现一丁点关于这方面的信息。

这个基本的例子在模拟器中的react-native 0.4.2中仍然不能为我工作。还不能在我的iPhone上试试。

<View style={styles.container}>
  <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}}
    onEndEditing={this.clearFocus}
  />
</View>

当前回答

键盘模块用于控制键盘事件。

import {Keyboard} from 'react-native' 在渲染方法中添加以下代码。 呈现(){ 返回<TextInput onSubmitEditing={键盘。驳回}/ >; }

你可以使用-

Keyboard.dismiss()

解散活动键盘,并根据react本机文档删除焦点。

其他回答

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

Keyboard.dismiss()就会这样做。但有时它可能会失去焦点,键盘将无法找到ref。最一致的方法是将ref=_ref放到textInput中,当你需要解除时执行_ref.blur(),当你需要恢复键盘时执行_ref.focus()。

const dismissKeyboard = require('dismissKeyboard');
dismissKeyboard(); //dismisses it

方法2;

感谢用户@ricardo-stuven指出这一点,还有另一种更好的方法来消除键盘,你可以在react原生文档的例子中看到。

简单地导入键盘并调用它的方法dismiss()

使用ScrollView代替带有keyboardShouldPersistTaps={"always"}属性的View。当我们点击屏幕内的任何地方时,它会隐藏键盘

<ScrollView keyboardShouldPersistTaps={"always"}>
 <View style={styles.container}>
  <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}}
    onEndEditing={this.clearFocus}
  />
 </View>
</ScrollView>

有几种方法, 如果你像onPress一样控制事件,你可以使用:

import { Keyboard } from 'react-native'

onClickFunction = () => {
     Keyboard.dismiss()
}

如果你想关闭键盘时使用滚动:

<ScrollView keyboardDismissMode={'on-drag'}>
     //content
</ScrollView>

更多的选项是当用户点击键盘外:

<KeyboardAvoidingView behavior='padding' style={{ flex: 1}}>
    //inputs and other content
</KeyboardAvoidingView>