如何在本机反应中禁用键盘

Posted 2023-04-14

技术标签:

【中文标题】如何在本机反应中禁用键盘【英文标题】：How to disable keyboard in react native 【发布时间】：2018-12-10 15:05:26 【问题描述】：

我创建了一个屏幕键盘组件，我想禁用平台的键盘，我该如何禁用它？

<TextInput
  secureTextEntry
  ref="Pin"
  selectionColor="#656565"
  keyboardType="numeric"
  activeColor="#656565"
  inactiveColor="#fff"
  autoFocus=false
  ignoreCase
  codeLength=4
  inputPosition="center"
  size=50
  onFulfill=isValid => this
  codeInputStyle= borderWidth: 1.5 
/>

【问题讨论】：

我认为你可以在这里研究它是如何完成的：github.com/wix/react-native-keyboard-input 【参考方案1】：

只需像这样在<TextInput> 中写showSoftInputOnFocus=false：

<TextInput showSoftInputOnFocus=false />

【讨论】：

这对我有用，谢谢【参考方案2】：

我也有问题。没有其他解决方案对我有用。这将显示文本输入字段，并且可以单击但不可编辑。

<TouchableOpacity onPress=this.openPinKeyboard>
  <View pointerEvents="none">
    <Input editable=false value="1234" />
  </View>
</TouchableOpacity>

【讨论】：

我根本无法使用输入法这就是重点。你不能编辑，但可以点击它。他说的是“禁用键盘”而不是“不能编辑它”，那些东西很不一样【参考方案3】：

我认为您需要添加以下内容：

<TextInput showSoftInputOnFocus=false keyboardType="numeric" />

【讨论】：

【参考方案4】：

您可以尝试将keyboardType 设置为none，如果不起作用，另一种选择是将editable 属性设置为false。

可以在这里找到可能的答案：https://github.com/facebook/react-native/issues/14045

【讨论】：

【参考方案5】：

将keyboardType 设置为null 对我有用

编辑：

这仅在模拟器中有效，在实际设备上运行时仍会出现本机键盘。

在下面的示例中将<TextInput /> 包装在<TouchableWithoutFeedback> 元素中有效。

<TouchableWithoutFeedback onPress=Keyboard.dismiss > <TextInput /> </TouchableWithoutFeedback>

【讨论】：

【参考方案6】：

试试这个解决方案，我希望这对 android 和 ios 都有效...

// Step 1: Get Keyboard, TouchableWithoutFeedback from ‘react-native’;
        import  View, TextInput, StyleSheet, Keyboard,  TouchableWithoutFeedback  from 'react-native';

        // Step 2: Create an arrow function to write dismiss keyboard code
        const DismissKeyboard = ( children ) => (
            <TouchableWithoutFeedback onPress=() => Keyboard.dismiss()>
                children
            </TouchableWithoutFeedback>
            );

        // Step 3: Wrap all TextInput inside <DismissKeyboard> </DismissKeyboard>
        //Example
        <DismissKeyboard>
            <View style=styles.container>
                <TextInput style=styles.input placeholder="email" />
                <TextInput style=styles.input placeholder="password" />
            </View>
        </DismissKeyboard>

【讨论】：

【参考方案7】：

最简单的解决方案是在 TextInput 上使用 onFocus 属性。

Keyboard