如何在 React Native 中禁用键盘

Question

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

<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 }}
/>

Answer 1

像这样在

showSoftInputOnFocus={false}

中写

<TextInput>

：

<TextInput showSoftInputOnFocus={false} />

Answer 2

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

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

Answer 3

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

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

Answer 4

设置

keyboardType

到

null

对我有用

编辑：

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

在下面的示例中将

<TextInput />

包装在

<TouchableWithoutFeedback>

元素中。

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

Answer 5

您可以尝试将

keyboardType

设置为

none

，如果它不起作用，另一种选择是将

editable

属性设置为

false

。

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

Answer 6

<TextInput showSoftInputOnFocus={false}/>

这对我有用，有时我需要 onFocus 操作来导航新屏幕，并且不需要键盘打开动画。 Prop Editable 将禁用文本字段，不能按下

Answer 7

尝试这个解决方案，我希望这对 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>

Answer 8

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

1. 从‘react-native’导入

   Keyboard

从中导入 {Keyboard, TextInput} '反应本机'

2. 然后将

   Keyboard.dismiss()

   传递给 TextInput onFocus 属性，以阻止键盘在聚焦时弹出。

Keyboard.dismiss()} .../>

现在测试输入框，按下它看看键盘是否会弹出

Answer 9

只需将它放在文本输入标签下，这在 react-native 中对我有用

              <TextInput
               //this line  
              editable={false}
             /> 

Answer 10

你可以通过 pointerEvents="none" 来完成

<View pointerEvents="none">
           <TextInput
             focusable={false}
             style={{color: '#00000000'}}
             onChangeText={setEmail}
           />
         </View>

Answer 11

showSoftInputOnFocus={false} 这对我有用谢谢