vue select change

<select @change="getjiaoSelected" name="" style="border: 1px solid #C7C7CC!important;" v-model="jiaoData.jiebanren">
<option :value="todo.id" v-for="todo in jiaoList">{{todo.nickname}}</option>
</select>

首先，先在template中添加以上代码，（也可以@change="jiaojieSelected（$elem）"，）

jiaoList: [],

其次，在data里面定义循环数组

//created

this.getJiao()

//methods

//下拉框监听事件
getJiao(e) {
//通过捕获select中的value赋值给接班人信息
this.$http
.get('api/v1/erjibengfangmember')
.then(result => {
if(result.body.status === 200) {
this.Date = result.body.data
//遍历获取下拉框人员
this.Date.forEach((ele, index) => {
if(ele.nickname != global.identify.nickname) {
this.jiaoList = this.jiaoList.concat(ele)
}
})
}
})

},

然后，在method方法中写个函数，在created中调用函数（因为created一进去页面就开始渲染，主要渲染出下拉框的数组）

getjiaoSelected(e) {
            //监听获取选择人员的ID
            this.jiaoList.forEach((item) => {
console.log(item.id)  //这是获取下拉框中的id
console.log(item.id)  //这是获取下拉框中的文本值
console.log(e.target)  //这是获取selected的整个表达式
                //获取到的value与获取到的人员ID对比
                if(item.id == e.target.value) {
                    this.Idname = item.id
                }
            })
        }

最后，通过获取到的下拉数组，与获取到的selected对象对比ID，然后可以赋值，这是可以拿的到option的value值与文本值的