Reactphonenumber2 NPM

react-phonenumber2

Telephone number input React component. Made with jquery and select2.

Install

npm install --save reactphonenumber2

Usage

First put the following link tag in your html file:

<link
  rel="stylesheet"
  href="https://cdnjs.cloudflare.com/ajax/libs/flag-icon-css/0.8.2/css/flag-icon.min.css"
/>

import React, { useState } from 'react'
import { ReactPhonenumber } from 'reactphonenumber2'

const countries = [
  { code: 'IR', name: 'Iran', dialingCode: '98' },
  { code: 'AF', name: 'Afghanistan', dialingCode: '93' },
  { code: 'AL', name: 'Albania', dialingCode: '213' },
  { code: 'AS', name: 'American Samoa', dialingCode: '1684' }
]

const App = () => {
  const [phoneNumber, setphoneNumber] = useState<string>('')

  const changePhoneNumber = (phoneNumber: string, selected:any) => {
    console.log(JSON.stringify({
      phoneNumber, selected
    }, null, 2))
  }

  return (
    <div>
      <ReactPhonenumber
        onChange={changePhoneNumber}
        countries={countries}
        defaultCode="IR"
      />
    </div>
  )
}

export default App