Início / coding / Perguntas / 79582312
Accepted
Ken
Asked: 2025-04-19 19:11:21 +0800 CST

vuetify v-select não carrega dados do array

  • 772

no VPlay adicionei este código:

<template>
    <v-app>
        <v-container>
            <v-select
                v-model="selectedState"
                :items="states"
                item-value="value"
                item-text="text"
                label="State"
                outlined
            ></v-select>
        </v-container>
    </v-app>
</template>

<script setup>
  import { ref } from 'vue'

  const selectedState = ref('')
  const states = ref([
    { value: '1', text: 'VIC' },
    { value: '2', text: 'ACT' },
  ])
</script>

O menu suspenso de seleção tem os dois objetos e não os pares valor/texto, como esperado.

Também recebo um aviso: Propriedade inválida: falha na verificação de tipo para a propriedade "título". String esperada | Número | Booleano, Objeto obtido

Sou iniciante no Vuetify. O que estou perdendo aqui? O que estou fazendo errado?

Minha intenção é obter dados do supabase via Pinia e criar um elemento select em um formulário.

vuetify.js

1 respostas

  1. Best Answer

    Você está perto, mas em vez de

     item-text="text"

    você realmente precisa

    item-title="text"

    Também item-value="value"não é necessário. O v-select obtém valor e título automaticamente. Portanto, se o seu objeto tivesse título em vez de texto, por exemplo, funcionaria imediatamente.

    documentos v-select

    • 2

relate perguntas