Wie kann ich Text auswählen, wenn Kategorie auf Combobox geklickt hat? (Vue.JS 2)

Question

ich eine vue Komponente wie diese:

<script> 
    export default{ 
     template: '\ 
      <select class="form-control" v-model="selected" v-on:change="search">\ 
       <option v-for="option in options" v-bind:value="option.id" v-bind:disabled="option.disabled">{{ option.name }}</option>\ 
      </select>', 
     mounted() { 
      this.fetchList(); 
     }, 
     data() { 
      return { 
       selected: '', 
       options: [{id: '', name: window.trans.category.select}] 
      }; 
     }, 
     methods: { 
      search(e){ 
       window.location = window.BaseUrl + '/search?q=&cat=' + e.target.value; 
      }, 
      fetchList: function() { 
       this.$http.post(window.BaseUrl+'/category/list?parent_id=all').then(function (response) { 
        response.data.forEach(function(item){ 
         this.options.push({id:item.id, name:item.name}) 
        }, this); 
       }); 
      }, 
     } 
    }; 
</script> 

Wenn Kategorie geklickt hat, möchte ich über Text der Kategorie

Auf meinem Code erhalten, verwende ich diese: e.target.value zu erhalten ID ausgewählt und es funktioniert

Aber wie kann ich Text ausgewählt, wenn Kategorie geklickt?

Ich versuche dies: e.target.text, aber id nicht

Gibt es funktioniert jemand, der mir helfen kann?

Answer 1

Da Sie beide id und name möchten, können Sie dies versuchen:

template: '\ 
     <select class="form-control" v-on:change="search">\ 
      <option v-for="option in options" v-bind:value="option.id" @click="selected=option.name" v-bind:disabled="option.disabled">{{ option.name }}</option>\ 
     </select>', 
    mounted() { 
     this.fetchList(); 
    },