antdesign select可输入可选择
作者:互联网
<a-form-item label="订单号"> <a-select :disabled="model && model.confirmOrder" show-search v-decorator="['orderNo']" placeholder="请输入订单号" :default-active-first-option="false" :show-arrow="false" :filter-option="false" :not-found-content="null" @search="handleSearch" @blur="handleBlur" @change="handleChange" > <a-select-option v-for="item in selectData" :key="item.orderNo"> {{ item.orderNo }} </a-select-option> </a-select> </a-form-item>
//订单下拉列表 handleSearch (val) { if (val != '') { const requestParameters = { OrderNo: val, } orderSelect(requestParameters).then((res) => { this.selectData = res this.selectValue = val }) } }, //选择下拉列表 handleChange (val) { this.selectValue = val let newData = this.selectData.filter(item => item.orderNo == val); if (newData.length > 0) { this.form.setFieldsValue({ orderNo: newData[0].orderNo, orderDate: moment(newData[0].orderDate).format('YYYY-MM-DD'), orderShipDate: moment(newData[0].orderShipDate).format('YYYY-MM-DD'), }) } else { this.form.setFieldsValue({ orderNo: this.selectValue, }) } }, //失去焦点 handleBlur () { this.handleChange(this.selectValue) },
data () { return { selectData: {}, selectValue: '', } },
标签:val,selectValue,item,selectData,select,antdesign,orderNo,newData,输入 来源: https://www.cnblogs.com/niyl/p/15006086.html