要在 addCustomer
事件中处理 mode="tags"
的输入,并确保传递手动输入的所有值,而不需要关联产品名称与借据号,你可以按照以下步骤进行:
调整数据结构:将
formModal.productName
和formModal.loanInfoCode
修改为能够保存标签(手动输入的内容)和选择项。收集手动输入的值:在构建要发送的参数时,直接将用户输入的产品名称和借据号都纳入考虑。
这里是修改后的 addCustomer
函数示例:
const addCustomer = (values) => {
// 获取手动输入和选择的产品名称
const selectedProducts = formModal.value.productName;
// 对于每个产品名称,获取相关的借据号,无论是选择还是手动输入
const selectedData = selectedProducts.map((productName) => {
// 不仅仅过滤已知贷款信息,还包括用户手动输入的信息
const loanCodes = formModal.value.loanInfoCode.map((loanCode) => loanCode.trim()).filter(loanCode => loanCode !== '');
return {
productName,
loanInfoCode: loanCodes, // 将所有借据号一并返回,不做关联处理
};
});
const params = {
workOrderLoans: selectedData,
};
addWorkOrder(params)
.then((response) => {
if (response.success) {
message.success(response.message);
} else {
message.error(response.message);
}
});
};
注释说明:
- 使用了
.map()
和.filter()
来收集所有传入的值,包括从下拉框选择的和用户自己手动添加的。 - 在构建
selectedData
时,将选定的产品与所有有效(非空)的借据号一起打包。这样,即使是通过标签模式 (tags
) 手动添加的借据号也会被包含在请求参数中,而无需依赖它们之间是否有特定关联。
注意事项:
- 确保你的 UI 界面上能允许用户自由地添加多种类型的数据,并且这些数据会根据业务逻辑进行处理。
- 此外,根据具体需求,可能需要增加验证逻辑,以确保发送的数据符合后端要求。
内容由零声教学AI助手提供,问题来源于学员提问