0.1.2 • Published 2 years ago

vuetify-country-search v0.1.2

Weekly downloads
-
License
Apache License 2....
Repository
github
Last release
2 years ago

vuetify-country-search

This package provides a pair of Vuetify components for countries/region select inputs. Components may be used together or standalone.


Installation

npm i --save vuetify-country-search
# or yarn add vuetify-country-search

Usage

import Vue from 'vue'
import VCountrySearch from 'vuetify-country-search'
Vue.use(VCountrySearch)

new Vue({}).$mount('#app')

// then inside your vue components
export default Vue.extend({
  data: () => ({
    country: '',
    region: ''
  })
})

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

Use standalone

<script>
import { VCountrySelect, VRegionSelect, AllCountry, } from 'vuetify-country-search'

export default {
  name: 'App',
  components: { VCountrySelect, VRegionSelect },
  data: () => ({ 
    country: '',
    state: '',
    AllCountry, // AllCountry are array of all country and state
  })
};
</script>

<template>
    <VCountrySelect v-model="country" />
    <br>
    <VRegionSelect v-model="state" :country="country">
</template>

Options

In addition to Vuetify VAutocomplete props, here are the available attributes that can be used with the provided components.

VCountrySelect

ParameterRequired?DefaultTypeDescription
v-modelyes''stringThe data binding for your component

VRegionSelect

ParameterRequired?DefaultTypeDescription
v-modelyes''stringThe data binding for your component

Contributing

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

Credits

License

Apache License 2.0