实现效果请参考iview select组件远程搜索：https://www.iviewui.com/components/select
render: (h, params) => {
return h(
"Select",
{
props: {
value: this.tableData[params.index].productNo,
remote: true, //是否使用远程搜索
filterable: true, //是否支持搜索
clearable: true, //是否可以清空选项，只在单选时有效
allowCreate: true, // 在 filterable 模式下，开启属性 allow-create 可以通过在输入框中输入文字来创建新的条目。
},
on: {
"on-create": (query) =>{
this.selectListno.unshift({
Yarn_Code: query,
mat_name: query,
yarn_ph: "",
yarn_pz: "",
})
},
"on-select": (value) => {
this.selectListno.forEach((res) => {
if (res.Yarn_Code == value.value) {
this.tableData[params.index].productNo = res.Yarn_Code;
this.tableData[params.index].batchSample = res.yarn_ph;
this.tableData[params.index].brand = res.yarn_pz;
this.tableData[params.index].NEW = true;
}
});
},
"on-query-change": (query) => {
this.remoteNo(query, params.index);
},
"on-clear": () =>{
this.selectListno = [];
this.tableData[params.index].NEW = false;
}
},
},
this.selectListno.map((item) => {
return h(
"Option",
{
// 下拉框的值
props: {
value: item.Yarn_Code,
label: item.mat_name,
},
},
[
h("span", item.mat_name),
h(
"span",
{ style: { color: "#808695", "margin-left": "10px" } },
item.yarn_ph
),
h(
"span",
{ style: { color: "#808695", "margin-left": "10px" } },
item.yarn_pz
),
]
);
})
);
},
