vue-email-dropdown

A Vue component for autocomplete email domains

Demo

Props

Prop	Type	Required	Default	Description
domains	Array	True	-	All domains that should be used to make a domain suggestions.
defaultDomains	Array	False	[]	Default domains that should be displayed once `@` is typed.
initialValue	String	False	""	Initial value for the email field.
maxSuggestions	Number	False	4	How many domain suggestions should displayed.

Installation

npm install vue-email-dropdown --save

# or with yarn

yarn add vue-email-dropdown

Usage

<template>
  <EmailDropdown :domains="domains" :defaultDomains="defaultDomains" />
</template>

<script>
// Import package
import EmailDropdown from "vue-email-dropdown";
// Import basic styles (optional)
import "vue-email-dropdown/dist/vue-email-dropdown.css";

export default {
  components: {
    EmailDropdown
  },
  data() {
    return {
      domains: [
        "yourcompany.com",
        "gmx.de",
        "googlemail.com",
        "hotmail.fr",
        "hotmail.it",
        "web.de",
        "yahoo.co.in",
        "yahoo.com",
        "yahoo.in"
      ],
      defaultDomains: [
        "gmail.com",
        "hotmail.com",
        "msn.com",
        "outlook.com",
        "yahoo.com"
      ]
    };
  }
};
</script>

Development setup

npm install

Compiles and hot-reloads for development

npm run serve

Compiles and minifies for production

npm run build

Run your unit tests

npm run test:unit

Lints and fixes files

npm run lint

Customize configuration

See Configuration Reference.

Contributing

1. Fork it (https://github.com/dannyfeliz/vue-email-dropdown/fork)
2. Create your feature branch (git checkout -b feature/fooBar)
3. Commit your changes (git commit -am 'Add some fooBar')
4. Push to the branch (git push origin feature/fooBar)
5. Create a new Pull Request