vuetify v-select:样式.去掉下划线并自定义占位符

Question

<v-col>
<v-select
class="custom" 
multiple
attach
chips
dense
:placeholder="header.text"
clearable
:items="columnValueList(header.value)"
v-model="filter[header.value]"
>[enter image description here][1]
</v-select>
</v-col>

我想去掉下划线，只显示下拉图标。我看起来很乱，当我点击项目时，下划线被填满了，设计看起来很乱。我能帮什么忙吗?

Answer 1

1. 设置v-select为轮廓
2. 在style部分执行此操作

.custom >>> fieldset {
border-style: none;
}

Answer 2

.select_class_name.v-text-field>.v-input__control>.v-input__slot:before { 
border-style: none; 
} 
.select_class_name.v-text-field>.v-input__control>.v-input__slot:after { 
border-style: none; 
}

只需将类名替换为v-select中的类名。