簡體   English   中英

如何使用逗號為 Input onChangeText React Native 驗證十進制?

[英]How to validate decimal with comma for Input onChangeText React Native?

我需要在TextInput (React Native)中驗證帶兩位小數的數字,以防止插入第二個逗號。 現在我可以輸入 123,12,23 並且它會破壞應用程序。

export default class Bottom extends Component {
  constructor(props){
    super(props)
    this.state = {
      sum:'',
    }
    this.handleInputChange = this.handleInputChange.bind(this);
  }

  handleInputChange(value) {
     // validation of the value
     this.setState({sum: value});
   }
 render () {
    return ( 
      <View>
       <TextInput 
        style={styles.input} 
        keyboardType ="decimal-pad"
        autoCorrect={false}
        placeholder='add'
        onChangeText={ this.handleInputChange }
        value={this.state.sum} 
       />
      </View> 
    );
  }

我嘗試使用indexOf但它刪除了第一個逗號,而不是第二個

if (value.indexOf(',') === -1) {
 this.setState({sum: value});

任何建議或正確答案的鏈接?

更新

我已經解決了:

handleInputChange(value) {
    let lastValid = this.state.sum;
    //var validNumber = new RegExp(/^\d*\.?\d*$/); // for dot
    var validNumber = new RegExp(/^\d*\,?\d*$/); // for comma
      if (validNumber.test(value)) {
        lastValid = value;
      } else {
        value = this.state.sum;
      }
    this.setState({ sum: lastValid });
  }

沙盒也更新了

沙盒: https://codesandbox.io/s/unruffled-blackwell-208p6?file=/src/App.js

我會這樣做:將onKeyPress={this.handleKeyPress}添加到您的TextInput ,然后:


handleKeyPress(evt) {
    evt = (evt) ? evt : window.event;
    var charCode = (evt.which) ? evt.which : evt.keyCode;
    if (charCode > 31 && ((charCode < 48 || charCode > 57) || charCode != 188)) {
        return false;
    }
    if (this.value.match(/,.*,/g) return false;

    return true;
}

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM