vue.js - 如何使用 Buefy 自动完成绑定 id 值但显示名称值？

Question

我正在尝试将Buefy Autocomplete集成到我的网站中。我的数据是一个对象数组，每个对象都包含一个整数 ID 和一个字符串名称。像这样

countries : [
    {
        id: 1
        name : 'Country 1',
    },
    {
        id: 2
        name : 'Country 2',
    },
]

正如文档所说，该field属性用于显示为选定的值并返回相同的值

我想将该name属性用作显示文本，但将其id用作选定选项。

此外，当我从 API 获得结果时，我得到国家id，我想根据id

这是示例小提琴

任何帮助将不胜感激。

score 0 · Accepted Answer

当您从“自动完成”下拉列表中选择建议时，它不仅会选择id或name，还会选择整个对象{...}。

因此，一旦您选择了它，您应该能够从那里选择要使用的字段，在您的情况下，id.

在其中一个示例的 Codepen 中，您可以看到选择了整个对象 - https://codepen.io/pen?&editable=true&editors=101

你确定你只得到了id而不是整个对象吗？

1 回答 1