防止 [az] 在 reactJS 的输入类型 tel 上输入

Question

I have an input type=tel component that Im trying to give some extra validation and prevent [az] from being typed and pasted on the input. So far I've used e.key and prop onKeyDown which i know I can prevent individual characters but i cant find the way to get [az] to work. Im trying with a good example I found here in SO but Im not sure how to get it, tried adding regEx insted but no luck...

const PhoneNumberInput = ({value, onChange, valid, ...rest}) => {

const [phoneValid] = useState(["a", "b", "c"]); <--- I added in a state what I dont want to be inputed, tried with `/[a-z]$*` but I understood that it wouldnt work... 

  return (
    <Input
      className={classNames('form-control ', {
        'is-invalid': !valid,
      })}
      type="tel"
      value={value}
      onChange={onChange}
      onKeyDown={e => phoneValid.includes(e.key) && e.preventDefault()}
      valid={valid}
      {...rest}
    />
  );
};

I've tried adding: const [phoneValid] = useState(["az"]); but I understood later that prop "onKeyDown" doesnt work that way... How can I do to get the [aA-zZ] blocked from being inputed || && pasted?

UPDATED CODE:

const PhoneNumberInput = ({value, onChange, valid, ...rest}) => {
  if(/(^$|^\d*$)/.test(value)) {
     console.log('entered value is number (or nothing i.e. empty input), do something.')
  } else {
    console.log('entered value is not a number - can be alphabet, space, special character, etc' )
  } <------ Im getting both states fired on console independent of number or letter

  return (
    <Input
      className={classNames('form-control ', {
        'is-invalid': !valid,
      })}
      type="tel"
      value={value}
      onChange={onChange}
      valid={valid}
      {...rest}
    />
   );
 };

Answer 1

if(/(^$|^\d*$)/.test(value)) {
 // entered value is number (or nothing i.e. empty input), do something.
} else {
 // entered value is not a number - can be alphabet, space, special character, etc 
}

Answer 2

Found a very nice and clean solution:

  const PhoneNumberInput = ({value, onChange, valid, ...rest}) => {
  value = value.replace(/[^0-9\+]/g, ''); <--- replace on the value 
  return (
    <Input
      className={classNames('form-control ', {
       'is-invalid': !valid,
      })}
      type="tel"
      value={value}
      onChange={onChange}
      valid={valid}
      {...rest}
    />
   );
 };