Skip to content

schtappe/vue3-select-component

 
 

Repository files navigation

Vue3-Select-Component

A select component for Vue 3 which helps you to develop a simple yet powerful select control with ease that works out-of-the-box, while still allowing you to customize it to your needs.

Documentation & demos with code: https://vue3-select-component.vercel.app

This component includes the following features:

  • Easy data manipulation with v-model
  • Great styling out-of-the-box, customization with CSS variables & Vue :deep
  • Single & multi-select
  • Deep customization with <slot>s
  • Teleport/portal menu

Installation

Install the package with npm:

npm i vue3-select-component

Use it in your Vue 3 app:

<script setup lang="ts"> import { ref } from "vue"; import VueSelect from "vue3-select-component";  import "vue3-select-component/dist/style.css";  const option = ref(""); </script> <template> <div class="my-app"> <VueSelect v-model="option" :options="[  { label: 'A Wizard of Earthsea', value: 'wizard_earthsea' },  { label: 'Harry Potter and the Philosopher\'s Stone', value: 'harry_potter' },  { label: 'The Lord of the Rings', value: 'the_lord_of_the_rings' },  ]" /> </div> </template>

License

MIT Licensed. Copyright (c) Thomas Cazade 2024.

About

A flexible & modern select-input control for Vue 3.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • Vue 89.9%
  • TypeScript 6.9%
  • JavaScript 1.9%
  • HTML 1.3%