如何在下拉框中显示父项名称同时传递ID值

在项目开发中，经常遇到需要在下拉框中显示父项名称（如供应商名称），但实际上绑定和提交的是ID值的情况。这种情况下，如果直接将v-model绑定到name属性上，则无法正确提交ID值；而如果将v-model绑定到ID上，则下拉框中显示的也会是ID值，而非用户友好的名称。为了解决这个问题，可以通过以下方式实现：

首先，确保你的表单元素和下拉选项正确设置，如下所示：

上述代码中，v-model 绑定的是 form.supplierId，即实际提交的ID值。而每个 el-option 的 :label 属性绑定了 item.name，这样下拉框中显示的就是供应商的名称。

通过这种方式，你可以实现在下拉框中显示供应商名称的同时，提交的是供应商的ID值，满足了既展示友好信息又确保后台处理的需求。