La vérification du type d'attribut Vuetify v-select échoue

Question

Lorsque j'utilise v-select dans Vuetify 3, je rencontre souvent l'erreur suivante :

[Avertissement Vue] : accessoire non valide : échec de la vérification du type pour l'accessoire 'titre'. Chaîne attendue | Numéro booléen mais objet

Dans

Je ne suis pas sûr de savoir quel est le problème. Je reçois un tableau d'objets d'une API backend comme réponse JSON. Mon objectif est d'afficher tous les noms d'utilisateur dans la liste déroulante, mais lorsque je sélectionne un élément dans la liste déroulante, je souhaite stocker l'objet entier dans une variable. Par exemple, si je sélectionne le nom d'utilisateur "Desmond" dans le menu déroulant, je souhaite que les objets liés à Desmond soient stockés, c'est-à-dire {"nom d'utilisateur" : "Desmond", "e-mail" : " desmond@test.com"}

<code><v-select
  v-model = "élément sélectionné"
  :items="articles"
  name="nom d'utilisateur"
  item-text="nom d'utilisateur"
  label="Sélectionner un élément"
  objet de retour
></v-select>
</code>

<script>
importer des axios depuis "axios" ;

exporter par défaut {
  nom : "Testing123",
  données() {
    retour {
      articles: [],
      élément sélectionné : nul,
    } ;
  },
  créé() {
    this.fetchItems();
  },
  méthodes : {
    fetchItems() {

      axios
        .get("http://localhost:5000/items", config)
        .then((réponse) => {
          this.items = réponse.data
        })
        .catch((erreur) => {
          console.erreur(erreur);
        });
    },</pré>
<p>Voici mon<code>response.data</code></p>
<pre class="brush:php;toolbar:false;">[
    {
        "nom d'utilisateur": "Eric",
        "email" : "eric@test.com",
    },
    {
        "nom d'utilisateur": "Desmond",
        « email » : « desmond@test.com »,
    },
]

Answer 1

Vous utilisez :item-text, qui est le nom de la propriété dans Vuetify v2, détaillé ici.

Dans la v3, cette propriété a été renommée :item-title.

Changez le nom et cela fonctionnera :

<v-select
  item-title="username" 
  ...
></v-select>

Des exemples peuvent être vus dans le aire de jeux.