Skip to content
On this page

ZvSelect

ZvSelect is a standalone component

INFO

Before you have to import the global css files in your project, follow instructions in Getting Started

Basic usage

Error message

vue
<template>
  <ZvSelect
    id="select"
    v-model="selectedValue"
    name="select"
    class="w-96"
    label="Your label"
    placeholder="Select an option"
    :options="[
      { value: 0, label: 'Option 1' },
      { value: 1, label: 'Option 2' },
      { value: 2, label: 'Option 3' },
    ]"
    :validations="[
      {
        condition: true,
        text: 'Error message',
      },
    ]"
  />
</template>

<script lang="ts" setup>
  import ZvSelect from '@zadigetvoltaire/ui/components/ZvSelect'
  import { ref } from 'vue'

  const selectedValue = ref()
</script>