Description:
The React country/region selector component to create connected country and region dropdowns, where the region field gets automatically updated when the user selects a country.
Installation:
# NPM $ npm install react-country-region-selector --save
Basic usage:
import React from 'react';
import { CountryDropdown, RegionDropdown } from 'react-country-region-selector';
import React from 'react';
import { CountryDropdown, RegionDropdown } from 'react-country-region-selector';
class Example extends React.Component {
constructor (props) {
super(props);
this.state = { country: '', region: '' };
}
selectCountry (val) {
this.setState({ country: val });
}
selectRegion (val) {
this.setState({ region: val });
}
render () {
const { country, region } = this.state;
return (
<div>
<CountryDropdown
value={country}
onChange={(val) => this.selectCountry(val)} />
<RegionDropdown
country={country}
value={region}
onChange={(val) => this.selectRegion(val)} />
</div>
);
}
}Default props.
{
value: '',
name: 'rcrs-country',
id: '',
classes: '',
showDefaultOption: true,
defaultOptionLabel: 'Select Country',
onChange: () => {},
labelType: C.DISPLAY_TYPE_FULL,
valueType: C.DISPLAY_TYPE_FULL,
whitelist: [],
blacklist: [],
disabled: false
}Preview:
