Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

511
Visualizações
Vuetify <v-list-item-group> v-model mutliple selecting doesnt work
<v-list shaped>
  <v-navigation-drawer>
    <v-list shaped>
      <v-list-item-group
          v-model="selectedItem"
          multiple
      >
        <template v-for="(item, i) in items">
          <v-list-item
              :value="item"
          >
            <v-list-item-title>{{item.text}}</v-list-item-title>
          </v-list-item>
        </template>
      </v-list-item-group>
    </v-list>
  </v-navigation-drawer>
data: () => ({
    selectedItem: 0,
    drawer: null,
    items: [
      { icon: 'fas fa-home', text: 'Dashboard', route: '/home' },
      { icon: 'fas fa-money-check-alt', text: 'Invoices', route: '/invoices' },
      { icon: 'fas fa-dolly', text: 'Partners', route: '/partners' },
      { icon: 'fas fa-exchange-alt', text: 'Items', route: '/items' },
    ],
  }),

Very simple code in vuetify (2.6.1),multiple selecting doesnt work, I can't preselect first item to be selected too. Its probably related to v-list-item-group component.

over 4 years ago · Santiago Trujillo
1 Respostas
Responde à pergunta

0

There are 2 mistakes in your code:

  • when you are using multiple prop, a selectedItem should be an array;
  • when you are applying :value="item", your selectedItem array should contain the whole object instead of its index.

So your code should be:

...
<v-list-item-group
  v-model="selectedItem"
  multiple
>
  <template v-for="(item, i) in items">
    <v-list-item>
      <v-list-item-title>{{item.text}}</v-list-item-title>
    </v-list-item>
  </template>
</v-list-item-group>
...
data: () => ({
  items: [
    ...
  ],
  selectedItem: [0],
}),
...
over 4 years ago · Santiago Trujillo Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda