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

g52tjvyc 于 2023-05-23 发布在 Vue.js

关注(0)|答案(2)|浏览(203)

使用vue2.6和vuetify 2.3，我有一个v-select菜单，里面有一个模块名称列表，对于item-text，我想从显示单个值变成一个用连字符连接的2个字段的值。
目前，我只有item-text来显示我从数据库中获得的模块名称。

<v-select
   :items="deplist"
   item-text="moduleName"
   item-value="moduleId"
   v-model="selection"
></v-select>

我想通过将2个字段（moduleName，moduleNum）与连字符连接来改变item-text组件。我怎么能在item-text中做到这一点？

item-text="moduleName" + "-" + "moduleNum"
ex: "Mathematics-108"

vue.js

来源：https://stackoverflow.com/questions/76307598/how-to-concatenate-two-fields-in-v-selects-item-text-vuetify

2条答案

按热度按时间

0ejtzxu11#

您需要直接在可用的插槽中写入不同的值。

<v-select
   :items="deplist"
   item-value="moduleId"
   v-model="selection"
>
 <template v-slot:selection="{ item, index }">
  {{ `${item.moduleName} - ${item.moduleNum}` }}
 </template>

</v-select>

对于这个插槽selection，当您选择一个值时，它将显示插槽内的html。

赞(0）回复(0）举报 2023-05-23

nle07wnf2#

你可以简单地写如下。请恢复，如果它工作或不？

item-text="moduleName+'-'+moduleNum"

赞(0）回复(0）举报 2023-05-23

我来回答

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

2条答案

相关问题

热门标签

最新问答