vuetify v-select样式:太大

Question

有没有可能在Vuetify中降低v-select的高度？我不明白为什么这个元素这么大/这么胖。

​

我的代码是：

<template>
  <div>
    <v-select
      outline
      dense
      v-model="filtresActivites"
      :items="activitesGroupees"
      item-text="activiteNomComplet"
      item-value="activiteCode"
      multiple
    >
      <template v-slot:selection="{ item, index }">
        <span v-if="index === 0" class="deep-orange--text">{{ filtresActivites.length }} activités</span>
      </template>
    </v-select>
  </div>
</template>

“你可以像这样给你的v-select添加高度属性：”：它不起作用。

我在组件的样式中添加了.v-select__selections { min-height: 30px }，但它不起作用。

Answer 1

您可以将height属性添加到v-select，如下所示：

<v-select
 :items="items"
 height=50
></v-select>

如果要更改v-select的css属性，可以通过添加此类来实现

.v-select__selections {
     min-height: 30px
}

缺省情况下，min-height为42px

当我们看不到您的代码时，也很难理解您的问题

Answer 2

您不必在v-select中使用大纲样式。去掉它。

来自vuetify的图像示例：

​