USelectMenu multiple default value | Nuxt | Page 1

Hi @fair gazelle. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:

Based on the provided knowledge sources, I can help you with setting default values for the USelectMenu component with multiple selection enabled. The issue in your code is a small syntax error. Here's the corrected version:

<script setup lang="ts">
const people = ['Wade Cooper', 'Arlene Mccoy', 'Devon Webb', 'Tom Cook', 'Tanya Fox', 'Hellen Schmidt', 'Caroline Schultz', 'Mason Heaney', 'Claudie Smitham', 'Emil Schaefer']

const selected = ref([people[0], people[2]])
</script>

<template>
  <USelectMenu v-model="selected" :options="people" multiple placeholder="Select people" />
</template>

The problem was in the ref initialization. You were missing a closing square bracket ] at the end of the array. With this correction, the USelectMenu should now have 'Wade Cooper' and 'Devon Webb' selected by default.

This approach is consistent with the example provided in the SelectMenu documentation (https://ui.nuxt.com/components/select-menu#multiple), where they demonstrate how to use the multiple prop and initialize the selected ref with an array of values.

Remember that when using the `multiple` prop, the `v-model` should be bound to an array, which is what you're doing correctly with `ref([...])`. This allows the component to handle multiple selections.

#USelectMenu multiple default value

Remember that when using the `multiple` prop, the `v-model` should be bound to an array, which is what you're doing correctly with `ref([...])`. This allows the component to handle multiple selections.

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

#USelectMenu multiple default value

Remember that when using the multiple prop, the v-model should be bound to an array, which is what you're doing correctly with ref([...]). This allows the component to handle multiple selections.

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

Remember that when using the `multiple` prop, the `v-model` should be bound to an array, which is what you're doing correctly with `ref([...])`. This allows the component to handle multiple selections.