Vue-material: ensemble sélectionné dans MdSelect

Créé le 29 nov. 2016 · 3Commentaires · Source: vuematerial/vue-material

Tout d'abord merci pour votre incroyable projet !

Il n'est pas clair pour moi comment définir la valeur par défaut pour la liste de sélection. Comment faire de « LIKE » une valeur par défaut dans l'exemple ci-dessous ?

operators: {
equal: "=",
greater_than: ">",
greater_than_or_equal_to: ">=",
in: "IN",
less_than: "<",
less_than_or_equal_to: "<=",
like: "LIKE",
not_equal: "<>",
}

<md-select>
    <md-option v-for="operator in operators" :value="operator" >
        {{ operator }}
    </md-option>
</md-select>

Merci!

question

Source

tridcatij

Commentaire le plus utile

Le code correct pour ce problème est :

<md-select v-model="myModel">
    <md-option v-for="(key, operator) in operators" :value="key">{{ operator }}</md-option>
</md-select>

{
  data: () => {
    return {
      myModel: 'like'
    };
  }
}

Ce n'est pas un comportement de Vue Material, mais une manière Vue.js de répéter des éléments.
Merci.

marcosmoura le 29 nov. 2016

👍3

Tous les 3 commentaires

Le code correct pour ce problème est :

<md-select v-model="myModel">
    <md-option v-for="(key, operator) in operators" :value="key">{{ operator }}</md-option>
</md-select>

{
  data: () => {
    return {
      myModel: 'like'
    };
  }
}

Ce n'est pas un comportement de Vue Material, mais une manière Vue.js de répéter des éléments.
Merci.

marcosmoura le 29 nov. 2016

👍3

J'ai utilisé le code suivant :

<md-select name="province" id="province" :value="province" >
  <md-option v-for="province in provinces" :value="province.id" >{{province.name}}</md-option>
</md-select>

Et un code similaire avec des composants de base :

<select name="province" id="province" :value="province" >
  <option v-for="province in provinces" :value="province.id" >{{province.name}}</option>
</select>

Le premier ne sélectionne pas la valeur de la province tandis que le second le fait.
la province est dans les données et les provinces proviennent d'une requête apollo

demonodojo le 23 févr. 2017

@marcosmoura dans l'exemple que vous avez donné, le v-for="(key, operator) in .. est retourné, il devrait être v-for="(operator, key) in .. selon la documentation . Un peu déroutant que ce soit value:key et non key:value.