Important: This documentation covers Yarn 1 (Classic).
For Yarn 2+ docs and migration guide, see yarnpkg.com.

Package detail

format-phonenumber

Chinaski19798MIT0.0.1

Format phone numbers: 123-456-7890. Validates numbers only and min-max length

react-component, react, format, phone, number

readme

Format-Phone-Number

Format a telephone number 123-345-67890

This is a simple package that provides the format 123-345-67890 to a telephone number.

It includes:

  • Validates that input is numbers only (or dashes, as it automatically adds them).
  • It has maximum length. (13 characters counting the 10 digits and 2 dashes).

Usage

  1. npm install format-phone-number --save
  2. Import FormatPhoneNumber from 'format-phone-number';
  3. Provide props: "onChange" (function) and "value" (string).
  4. You can pass it a className string and provide any input style.

Example

import React from 'react';
import FormatPhonenumber from 'format-phonenumber';

class AppComponent extends React.Component {

  constructor (props) {
    super(props);
    this.state = {
      phoneNumber : '',
    };
  }

  render() {
    return (
      <div>
        <FormatPhonenumber
          className="input-formatter"
          onChange={this.handleChange} value={this.state.phoneNumber}
        />
      </div>
    );
  }

  handleChange = (value) => {
    this.setState({
      phoneNumber : value
    })
  }
}

export default AppComponent;

License

MIT