在react-native中隐藏键盘

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

这个基本的例子在模拟器中的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>

当前回答

在ScrollView中使用

keyboardShouldPersistTaps="handled"

这个可以帮到你。

2017-12-31 12:05:54

其他回答

首次导入键盘

import { Keyboard } from 'react-native'

然后在你的TextInput你添加键盘。解散到onSubmitEditing道具。你应该有这样的东西:

render(){
  return(
    <View>
      <TextInput 
        onSubmitEditing={Keyboard.dismiss}
       />
    </View>
  )  
}

2018-10-12 14:20:36

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

2015-05-06 17:59:39

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

2018-03-26 22:52:35

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

方法2;

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

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

2016-10-07 12:30:58

使用react-native中的KeyBoard API就可以了。

import { Keyboard } from 'react-native'

// Hide the keyboard whenever you want using !
Keyboard.dismiss()

2022-05-09 07:11:57

在react-native中隐藏键盘

推荐文章

最新文章

标签