1.0.7 • Published 2 years ago
global-country-state-city-select v1.0.7
Global Country State City Select
Basic library for Country, State and City with select inputs
Basic library for Country, State and City with select inputs built with vue.js.
- Input select with all countries around the world
- Select for states of that country
- Input select with option Cities belong to that state
- Allow to customize it using props
Installation
CountryStateCitySelect requires Node.js to run.
Install the dependencies and devDependencies and start the server.
npm i global-country-state-city-selectProps
| Props | Type | Default | Description |
|---|---|---|---|
| countryLabel , stateLabel , cityLabel | String | Choose your { country , state , city }: | Label to show above the select input. |
| countryBgColor , stateBgColor , cityBgColor | String | default | Background color of your input select with white text accept option { blue , red , green }. |
| countrySize , stateSize , citySize | String | default { 14px } | Applying {padding , borderRadius , fontSize , lineHeight } of your input select and accept option {small , default , large } |
| countryRounded , stateRounded , cityRounded | Boolean | default { True } | Applying { borderRadius of 60px } of your input select and accept option { true , false } |
Usage Example
<global-country-state-city-select :countryLabel="new label form country select" :stateBgColor="blue" :citySize="large" :countryRounded="false" />How to import it in your vue app
In your main.js, or a similar entry point for your app:
import SelectCountryStateCity from "SelectCountryStateCity";import Vue from "vue";Vue.use(SelectCountryStateCity);Plugins
CountryStateCitySelect is currently extended with the following plugins. Instructions on how to use them in your own application are linked below.
| Plugin | README |
|---|---|
| Bili | https://bili.egoist.sh |
| Rollup.js | https://rollupjs.org/guide |
License
MIT