如何添加＆＃39;完成＆＃39;使用react-native的数字键盘上的按钮

Question

我在反应原生中使用数字键盘键盘，我想在点击完成按钮时隐藏键盘，因为我想在键盘上方添加完成按钮，是否有任何可能像IOS应用程序隐藏键盘，任何帮助非常感谢

Answer 1

我不确定这是否正是您想要的，但您可以添加“完成”功能。使用prop returnKeyType键盘到键盘。

例如：returnKeyType={ 'done' }

此处有更多信息https://facebook.github.io/react-native/docs/textinput.html#returnkeytype

Answer 2

returnKeyLabel - 按钮的文字是什么。

onSubmitEditing - 点击操作。 Keyboard.dismiss这里解除键盘。

<TextInput 
  returnKeyLabel='Done' 
  returnKeyType='done' 
  onSubmitEditing={Keyboard.dismiss} />

Answer 3

在 2021 年使用 React Native v.63

• 如果您只使用 returnKeyType='done'，它会自动隐藏键盘
• 请注意，您也可以将自己的函数与 onSubmitEditing={() => yourFunctionNameHere()}
一起使用

这对我有用=>

                <TextInput
                  style={styles.textBox}
                  maxLength={5}
                  placeholder="Enter Zip Code"
                  placeholderTextColor={'#6D7376'}
                  autoCompleteType="postal-code"
                  keyboardType="number-pad"
                  returnKeyType="done"
                  onChangeText={text => setZip(text)}
                  onSubmitEditing={() => yourFunctionNameHere()}
                />

这里是直接文档 https://reactnative.dev/docs/textinput#returnkeytype

Answer 4

当 keyboardType="number-pad" 时，UITextField 本身不支持 returnKeyboardType

自定义键盘开发可以为您提供帮助。