概要
这次是写一个基于ant design vue的社团招新小程序的后台，因为涉及成员的三种状态描述（不/通过，待定），所以在此使用select进行实现，并且点击下拉框选择会触发对应的函数，更改数据库的数据反映到小程序端。今天那就来讲讲select的使用以及对应触发函数的绑定，先看一下实现的效果图：
具体实现过程：
写好前端样式
对于组件的使用我们可以先去官网文档找到自己想要实现的效果（官方文档传送门），这次我们使用获得选项文本的样式，然后改变参数，写成我们自己想要的效果看一下 a-select 中的参数，label-in-value 是把每个选项的 label 包装到 value 中，这样的话下面：default-value 后面我们指定的格式就是{key：}，key 后面对应的值是多少，我们选择框的默认值就是多少，通过 value 来指定对应的值。因为我们选择下拉框需要保持选择不变，所以此时我们需要设置动态的默认值，因为我这里有三个选项，所以后面利用了三目选择表达式。<template slot="first_ispass" slot-scope="text,record"><a-selectlabel-in-value:default-value="{ key: record.first_ispass==0?'0':(record.first_ispass==1?'1':'2') }"style="width:80px"@change="changefirstpass($event,record)"><a-select-option value="2">待定</a-select-option><a-select-option value="1">通过</a-select-option><a-select-option value="0">不通过</a-select-option></a-select></template>
完成 js 部分
1.在 a-select 中添加事件@change，在选择框value值改变的时候会触发此事件，因为我这里需要传两个值，一个是value值，一个是这一行的数据值，所以用 @change=“changefirstpass($event,record)” 写法传两个参数
2.最后写对应的触发函数，获取到我们需要的值，然后向后端接口发送请求完成操作
async changefirstpass ($event,record) {this.fp.student_id = record.student_id,this.fp.first_ispass = $event.key// 网络请求const { data: res } = await first_ispassApi(this.fp);this.$message.success('更新成绩状态成功！')this.getUserList()},
