如何在文本输入中验证用户电话号码？

Question

I have a textinput and i want to validate user input before it's showing on textinput .

i have tried used regex to do this, but i have a problem with the following code:

  _onChangeHP(hp){
    console.log('hp', hp)
    let reg = /^08[0-9]{9,}$/
    if(reg.test(hp)){
      this.setState({noHP:hp})
    }
  }

  <TextInput
    value={this.state.noHP}
    maxLength={13}
    placeholder={'08xxxxxxxxx'}
    keyboardType="numeric"
    onChangeText={(text)=>this._onChangeHP(text)}
  />

_onChangeHP() function checked one by one, so regex pattern never pass true in if statement ,

is there a way to validate user input?

My Expected result is setState when user value first string is 0 and 2nd string is 8 and the rest is numeric only,

Answer 1

you can use pattern function where number can be put in conditional.

<input  maxLength={13} placeholder='08xxxxxxxxx' keyboardType="numeric"
      pattern="[0][8][0-9]{11}"  />

Answer 2

you can't do it with only one regex

 _onChangeHP('08') _onChangeHP('01') _onChangeHP('08222222') function _onChangeHP(hp){ let regStartsWith = new RegExp('^08', 'i'); let regAfter = /^\d+$/; if(regStartsWith.test(hp)){ // this will check if starts with 08 if(regAfter.test(hp.substring(2))){ console.log(true) // this will check if hp has number after 08 return true; } else{ console.log(false); return false; } } else{ console.log(false); return false; } }

Answer 3

You'll have to use groups in regular expressions.

The solution to your problem: /^(0|08|08[0-9]{1,9})$/

Explanation: Capture if it's a 0 or 08 or 08x or 08xx or 08xxx or 08xxxx ... upto 08xxxxxxxxx ( ie upto 9 x's, and x can be any single digit number ).