0

Как форматировать инпут с 89098902834 на 8(909) 890-28-34? Нужно чтобы значение менялось на событии onChange

const [inpValue, setInputValue] = useState("");

  useEffect(() => {
   //как конвертировать номер
   }, [inpValue]);

   <input 
       type="tel"
       placeholder="+7 (999) 999-99-99"
       value = {inpValue}
       onChange={(e) => {
           setInputValue(e.target.value);
       }}
   />


 
1
  • 2
    Дан инпут, это хорошо. Еще лучше бы увидеть ваш код, с которым у вас возникли проблемы
    – SwaD
    11 фев в 18:30

1 ответ 1

0

Используйте библиотеку libphonenumber-js.

import { isValidPhoneNumber, parsePhoneNumber } from 'libphonenumber-js'

const input = '89098902834'

const convertPhoneNumber = (inp) => {
  if (isValidPhoneNumber(inp, 'RU')) {
    const phoneNumber = parsePhoneNumber(inp, 'RU')
    return phoneNumber.formatNational()
  }
  return inp
}

convertPhoneNumber(input) // 8 (909) 890-28-34

Соответственно если вы хотите вызывать функцию в onChange, то:

onChange = {(e) => { setInputValue(convertPhoneNumber(e.target.value)) }

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.