Files
oa/documentation/elements/forms/select/select-loading-documentation.md
2025-05-24 01:49:48 +09:00

1.7 KiB

state
state
input
Batman

Loading and Disabled select

vuero VSelect can be shown in a loading state. To apply that style, simply add the loading property to the VControl wrapping element. The disabled property should be set on VSelect, like the default behavior. Please refer to the code example for more details about usage.

<script setup lang="ts">

const input = ref('')
</script>

<template>
  <VField>
    <VControl
      loading
      class="has-icons-left"
      icon="lnil lnil-basketball"
    >
      <VSelect v-model="input" disabled>
        <VOption value="">
          Select a Hero
        </VOption>
        <VOption value="Superman">
          Superman
        </VOption>
        <VOption value="Batman">
          Batman
        </VOption>
        <VOption value="Spiderman">
          Spiderman
        </VOption>
        <VOption value="Deadpool">
          Deadpool
        </VOption>
        <VOption value="Spawn">
          Spawn
        </VOption>
        <VOption value="Galactus">
          Galactus
        </VOption>
      </VSelect>
    </VControl>
  </VField>
</template>
Select a Hero Superman Batman Spiderman Deadpool Spawn Galactus