我如何在一个 v-autocomplete 中绑定两个属性

【问题标题】：How do i bind two attributes in one v-autocomplete我如何在一个 v-autocomplete 中绑定两个属性
【发布时间】：2022-12-17 01:56:19
【问题描述】：

我如何实现自动完成以在选择时同时显示值和文本？

products: [
   {
      text: "Apple",
      value: 209
   },
   {
      text: "Banana",
      value: 229
   }
]

<v-autocomplete>
   ...
   :item="products"
   item-text="text"

</v-autocomplete>

目前可以查看文本，我希望两个人在选择前都能看到

【问题讨论】：

标签： vue.js vuetify.js vuex

【解决方案1】：

使用slots你可以这样做-

<v-autocomplete
   :items="products"
   label="Select"
   item-text="text"
   item-value="value"
 >
  <!-- If you want to modify the selected data -->
   <template v-slot:selection="data">
     {{ data.item.text }} {{ data.item.value }}
   </template>

   <!-- If you want to modify the list options -->
   <template v-slot:item="data">
     {{ data.item.text }} {{ data.item.value }}
   </template>
</v-autocomplete>

【讨论】：