[Vuejs]-How to display an array of objects where values are also an array

by

0👍

✅

It doesn’t look like vue-select supports <optgroup> yet. It’s on the backlog (https://trello.com/c/XOH2ZO69), so support might be added in the future. There’s a GitHub issue requesting the feature, and someone has posted a workaround there. Maybe this will work for you?

https://github.com/sagalbot/vue-select/issues/342#issuecomment-619356042

In case the link breaks in the future, here’s the code from arggasasao:

<select @change="onChange($event, index)">
  <option selected>seleccionar</option>
  <slot v-for="(item, i) in topItems">
    <optgroup :key="i" v-if="item.sections" :label="item.name">
      <option v-for="(subItem, i) in item.sections.section" :key="i" :value="subItem.url">{{ sub.name }}</option>
    </optgroup>
    <option :key="i" v-if="!item.sections" :value="item.url"> {{ item.name }} </option>
  </slot>
</select>

Leave a comment