如何在 v-autocomplete item-text vuetify 中连接两个字段

Question

我正在寻找一种方法来连接 v-autocomplete 项目文本字段中的两个字段，

这是我的代码：

            <ol>
              <li>
                  <v-autocomplete
                    placeholder="Search a person"
                    prepend-inner-icon="mdi-magnify"
                    chips
                    clearable
                    dense
                    v-model="counterpart1"
                    item-value="id"
                    item-text="first_value"
                    :items="enrolled1"
                  />
              </li>
            </ol>

我期望这样的事情：

            <ol>
              <li>
                  <v-autocomplete
                    placeholder="Search a person"
                    prepend-inner-icon="mdi-magnify"
                    chips
                    clearable
                    dense
                    v-model="counterpart1"
                    item-value="id"
                    item-text="first_value + second_value"
                    :items="enrolled1"
                  />
              </li>
            </ol>

我试过这个：

item-text="first_value + second_value"

和这个：

:item-text="`${first_value}, ${second_value}`"

但我得到了[object Object]。我发现了这个类似的问题，但我认为我的情况有点不同，我不明白如何以这种方式改变它。

任何帮助将不胜感激

Answer 1

使用函数来渲染item-text.

:item-text="getItemText"

然后，在你的methods：

getItemText(item) {
    return `${item.first_value} ${item.second_value}`;
}