search-dropdown-vue
An easier way to display A Vue.js dropdown component with search,
No special dependencies, no jquery, no tailwind.css, just VueJS and CSS magic.
Installation
$ npm install search-dropdown-vue
// OR
$ yarn add search-dropdown-vue
Requirements
Usage
<SearchDropdown
:options="countries"
v-on:selected="onSelectedOption"
v-on:filter="getDropdownValues"
>
</SearchDropdown>
<script setup>
import SearchDropdown from 'search-dropdown-vue'
import {reactive, ref} from 'vue
const countries = ref([
{id:1, name:'Morocco'},
{id:2, name:'USA'},
{id:3,name: "Canada"}
])
let object = reactive({id:null, name: null})
const onSelectedOption = (payload) => object = payload
</script>
Default values of props
| Property |
Type |
Default value |
| closeOnOutsideClick |
boolean |
true |
| placeholder |
string |
'Please select an option.' |
| name |
string |
'dropdown input.' |
| disabled |
boolean |
false |
| maxItem |
number |
10 |
License
The MIT License