vuetify v-select显示长字符串

Question

我正在制作一个包含带有长字符串项（例如

）的v-select控件的表单

• 显示标题的长字符串项

• 显示手的长字符串项目

以此类推。

v-select控件将通过使用手机显示，因此用户应阅读每一项，而不是以下内容

• 长字符串项目...
• 长字符串项目...

是否可以将完整的项目文本显示在列表项目中？

Code Pen

properties: {
    slotProps: {
      type: "string",
      title: "Custom enums",
      enum: [
        'long string item to display in devices with small screens and Head',
        'long string item to display in devices with small screens and Hands',
        'long string item to display in devices with small screens and Eyes',
        'long string item to display in devices with small screens and Stomach',],
    },
    }

以下是一些屏幕截图：

Answer 1

直接在插槽内提供物品。这将删除文本截断。

<v-select
  v-model="select"
  :items="items"
  label="Select"
  >
  <template v-slot:item="slotProps">
    {{slotProps.item}}
  </template>
</v-select>

...
...
data: {
  select: null,
  items: [
    'long string item to display Head',
    'long string item to display Hands',
    'long string item to display Eyes',
    'long string item to display Stomach',
   ],
}