vue-country-region-select-lite v0.1.2

Vue-Country-Region-Select-Lite

Vue-Country-Region-Select-Lite provides a pair of Vue components that will allow you to easily put a country and region dropdown in your project that will work together or standalone. Supports vue-i18n. This is the adapted version that includes a select amount of countries. The full version can be found here https://github.com/gehrj/vue-country-region-select

Installation

npm install vue-country-region-select-lite --save

Currently supported Countries

• United States
• Canada
• China
• Germany
• Ireland
• Japan
• Mexico
• United States minor outlying islands

(I am open to adding a few more based on use case, the full version linked above includes a very thorough list of countries, this is meant to be a very slim version )

Usage

Here is a sample use case of how you would use vue-country-region-select in your vue project. You can alternatively store the data in a store somewhere. Country and Region values will be returned in their short code values by default.

Ex. country: 'US' and region: 'IL'

There is a prop that will allow for country to be returned in full instead of in short code version.

The library registers the components globally so only need to import the library once in order to make the components be available throughout your project.

import Vue from 'vue'
import vueCountryRegionSelect from 'vue-country-region-select'
Vue.use(vueCountryRegionSelect)

export default Vue.extend({
  data: () => ({
    country: '',
    region: ''
  })
})

<template>
  <country-select v-model="country" :country="country" topCountry="US" />
  <region-select v-model="region" :country="country" :region="region" />
</template>

Options

Here are the available attributes that can be used with the provided components.

<country-select />

<region-select />

Contributing

Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.

License

MIT

vue-country-region-select-lite