最近，项目中碰到需求，要求任务类型可以从下拉框（后台返回的数据）中选择，也可以手动输入添加新项，项目用的是antd-vue，所以最接近的组件就是a-select组件了，废话不多说，改造方法如下：
HTML：
1 15 16{{ item.work_type }}17 18
data定义：
1 data () {2 return {3 value:undefined,4 typeData:[],//任务类型数组5 }6 }
methods方法：
1 /**2 * @function 任务类型文本框的值变化时的回调3 * @author ***4 * @time -08-175 **/6 handleSearch (value) {7 this.handleChange(value);8 },9 /**10 * @function 任务类型改变时的回调11 * @author ***12 * @time -08-1713 **/14 handleChange (value) {15 this.value = (!isNaN(value)&&value!='')?this.typeData[value].work_type:value;16 },17 /**18 * @function 任务类型失焦事件19 * @author ***20 * @time -08-1721 **/22 handleBlur(value) {23 this.value=value;24 this.model.workType = this.value;25 },
后台接口返回的数据如下：
效果图如下：
PS：模糊查询功能请自行完善
