0
votes

Vue JS Sélectionnez l'option n'apparaissant pas en raison du modèle V

OK, je travaille donc sur certains code permettant à un utilisateur de changer le magasin qu'ils appartiennent. J'utilise une balise et je possède un modèle V. Dans la balise, j'utilise une boucle pour donner aux magasins que l'utilisateur peut choisir.

Voici mon code: xxx

Tout ce que je veux maintenant consiste à ajouter un " Inchangé "Valeur par défaut pour apparaître avant tout avant tous les choix. Fondamentalement, une simple


                        
                        
                            
                                                                    vue.js
                                                                    vue-component
                                                                    vuejs2
                                                            
                        
                                                    
                            
                            
                                0 commentaires



                                    
                    3 Réponses :
                    
                                            
                            
                                
                                    0
 votes
                                
                            
                            
                                
                                     Ajoutez votre option  par défaut  code>, attribuer une valeur   code> non prise et init votre  v-modèle  code> avec valeur. La liaison de Vue prendra soin du reste. 
<div v-if="contestant.stores.length > 1" class="mt-10 col-sm-10">
 <select class="form-control" v-model="riot_account_store"  v-on:change="onChangeStore()">
    <option value="not_taken_id">default</option>
    <option v-for="store in contestant.stores" :key="store.objectId" :value="store.objectId">{{ store.name }}</option>
 </select>
</div>

date () {
  return {
    riot_account_store: 'not_taken_id'
  }
}

                                

                                                                    
                                    
                                    
                                        0 commentaires
                                        
                                                                                    
                                    
                                                            
                        
                        
                                            
                            
                                
                                    0
 votes
                                
                            
                            
                                
                                     Vous devrez stocker la sélection «initiale» quelque part, par exemple dans le bloc de données:  xxx  
 puis modifier votre -tag à:   xxx < / pré>                                 

                                                                    
                                    
                                    
                                        0 commentaires
                                        
                                                                                    
                                    
                                                            
                        
                        
                                            
                            
                                
                                    2
 votes
                                
                            
                            
                                
                                     Votre option nécessite une valeur. C'est tout: 
  p> 


<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="app">
  <div v-if="stores.length > 1" class="mt-10 col-sm-10">
    <p>Selected: {{ riot_account_store }}</p>
    <select class="form-control" v-model="riot_account_store"  v-on:change="onChangeStore()">
          <option :value="null">unselect</option>
          <option v-for="store in stores" :key="store.objectId" :value="store.objectId">{{ store.name }}</option>
      </select>
  </div>
</div>

                                

                                                                    
                                    
                                    
                                        0 commentaires