React Native - 如何仅键入数字键盘（不带标点符号）答案

【问题标题】：React Native - how to key number pad ONLY (without punctuations)React Native - 如何仅键入数字键盘（不带标点符号）
【发布时间】：2018-07-25 16:32:04
【问题描述】：

有没有办法在没有标点符号的情况下键入数字小键盘？

<TextInput keyboardType='numeric' ..... />

如果我使用secureTextEntry={true}，它会得到我想要的正确键盘，但值会替换为*。

所以，这就是我得到的：

这就是我想要的：

【问题讨论】：

phone-pad btw 生成 pause、wait 等键，所以这不是答案

标签： react-native keyboard numeric

【解决方案1】：

你试过number-pad吗？ number-pad 和 numeric 在 iOS 上都为我工作。

【讨论】：

我没有构建一个仅限 IOS 的应用程序！
由于某种原因在 Ipad 中不受支持（尚未在平板电脑上测试）。

【解决方案2】：

请试试这个，

<TextInput 
     keyboardType = 'numeric'/>

【讨论】：

【解决方案3】：

keyboardType={"number-pad"} 适用于 Android。注意：我使用的是 react-native-elements 中的 FormInput。

【讨论】：

注意：“数字键盘”仅适用于 react-native 版本 0.56 或更高版本的 android。

【解决方案4】：

我遇到了同样的问题。

我可以解决这样的问题：

keyboardType={Device.isAndroid ? "numeric" : "number-pad"}

然后在来自onChangeText 的方法调用中这样做：

const cleanNumber = number.replace(/[^0-9]/g, "");

this.setState({
  cleanNumber
});

它是 TextInput 的 value 属性

value={this.state.cleanNumber}

【讨论】：

【解决方案5】：

React native 未提供 keyboardType，它会从键盘上删除标点符号。您需要使用带有替换方法的正则表达式从文本中删除标点符号并设置keyboardType = 'numeric'。

正则表达式

/[- #*;,.{}[]\/]/gi

示例代码

 onTextChanged(value) {
    // code to remove non-numeric characters from text
    this.setState({ number: value.replace(/[- #*;,.<>\{\}\[\]\\\/]/gi, '') });
  }

请查看零食链接

https://snack.expo.io/@vishal7008/numeric-keyboard

【讨论】：

【解决方案6】：

Android 不支持没有标点符号的键盘类型A visual guide to the React Native TextInput keyboardType prop values

【讨论】：

【解决方案7】：

在我的情况下，对于 Android，我阻止使用 Miguel Cardenas 示例设置任何特殊字符。

我做了什么：

const inputRef = useRef(null);
const setRefValue = v => {
      const clean = v.replace(/[^0-9]/g, '');
      inputRef.current.value = clean;
      inputRef.current.setNativeProps({ text: clean });
    }
  };

<TextInput
   ref={inputRef}
   keyboardType={numeric}
   onChangeText={setRefValue}
/>

每次在 TextInput 中输入常量setRefValue 都会清除特殊字符。

【讨论】：

【解决方案8】：

(Platform.OS === 'ios') ? 'done' : 'next' — 好的秒杀

【讨论】：

我看不出这如何回答本页顶部的问题，但它应该。请edit根据How to Answer或删除答案。否则，它可能会被标记为“不是答案”并被删除。
为了扩展@Yunnosch 的关注，这个问题是关于如何显示数字键盘。事实上，可能有必要根据平台来改变它，就像其他答案所做的那样，但您仍然需要展示如何显示键盘，而您的答案目前没有这样做。