在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>

当前回答

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

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

你可以使用-

Keyboard.dismiss()

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

2019-04-11 17:08:50

其他回答

你可以像下面这样从react-native导入键盘:

import { Keyboard } from 'react-native';

在你的代码中可以是这样的:

render() {
    return (
      <TextInput
        onSubmit={Keyboard.dismiss}
      />
    );
  }

静态解散() 解散活动键盘并移除焦点。

2017-06-17 07:47:14

用以下内容包装整个组件:

import { TouchableWithoutFeedback, Keyboard } from 'react-native'

<TouchableWithoutFeedback onPress={() => Keyboard.dismiss()}>
...
</TouchableWithoutFeedback>

为我工作

2019-11-19 22:28:57

隐藏键盘使用 TextInput内部的Keyboard.dismiss()

2020-10-29 07:47:56

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

2015-05-06 17:59:39

将TextInput的父组件View包装到一个可压组件中，然后传递Keyboard。解散到onPress道具。因此，如果用户点击TextInput字段之外的任何地方，它将触发键盘。导致TextInput字段失去焦点，键盘被隐藏。

<Pressable onPress={Keyboard.dismiss}>
  <View>
    <TextInput
      multiline={true}
      onChangeText={onChangeText}
      value={text}
      placeholder={...}
     />
   </View>
</Pressable>

2022-06-03 15:28:50

在react-native中隐藏键盘

推荐文章

最新文章

标签