@dariustanhai/vue-dropdown NPM

dropdown

VueJS lightweight dropdown component

Check out the live DEMO

Installation

$ npm install --save @dariustanhai/vue-dropdown

Usage

<template>
  <dropdown
    class="dropdown"
    :data="data"
    :current="current"
    identifier="countries"
    @propagate="setDropdown"
  />
</template>

<script>

export default {
  data() {
    return {
      data: ['Brazil', 'Canada', 'Japan'],
      current: 'Japan'
    }
  },
  components: {
    dropdown: () => import('@dariustanhai/vue-dropdown') 
  },
  methods: {
    setDropdown (identifier, value) {
      this.current = value
    }
  }
}
  
</script>

<style lang="scss">

.dropdown {
  width: 200px;
  height: 50px;
  margin: 20px auto;
  h5 {
    color: white;
    font-size: 15px;
    font-family: 'Arial';
  }
  .current {
    background-color: black;
    border-radius: 5px;
  }
  .subMenu {
    background-color: black;
    border-radius: 5px;
  }
  .icon {
    color: white;
  }
}
  
</style>