VUE如何获取下拉框选中的KEY值

1、下拉框展示

<label for="sel1" class="form-label">文章分类：</label>
<select class="form-select" id="sel1" name="sellist1" @change="selectNoteClassification($event)">
    <option v-for="(item,index) in noteClassification" :value="item.id">{{item.title}}
    </option>
</select>

2、选中事件代码

selectNoteClassification(event){
    console.log(event);
    var selectIndex =event.target.selectedIndex;//选中的第几个option元素 从0开始
    var options = event.target.options;//代表option组合

    options[selectIndex].innerHTML  //选择的值 // categoryTitle
    event.target.value;  //绑定的value值  //v-bind:value="category.id"

    console.log("options[selectIndex].innerHTML=="+options[selectIndex].innerHTML);
    console.log("event.target.value=="+event.target.value);
},

 

3、关键要点：

 A、这里要用:value 来把 value的实型设置成你要的值，这样在event.target.value，就会把你要的value值取出来。如果不加这个

默认value属性值就是title