Javascript 当我在Vue应用程序中使用select tag时，下拉图标消失。（铬）

我正在用Vuetify开发一个Vue.js应用程序。但是当我使用选择标记时，下拉图标消失了

<template>
    <select class="select">
        <option
            v-for="item items"
            :key="item"
        >{{item}}</option>
    </select>

</template>

<script>
export default {
    data: () => ({
        items:['apple', 'tomato']
    }),
};
</script>

<style>
.select {
    border-radius: '3px';
    border: '1px solid #333333';
    padding-left: '3px';
}
</style>

但是当我在Chrome中测试纯HTML代码时，我可以看到下拉图标

<select>
    <option> apple</option>
    <option> tomato</option>
</select>

我猜Vuetify改变了我应用程序的CSS样式。如何使图标显示

---

我不能用。因为v-select太大了。我需要一个小的高度选择框。这就是为什么我使用香草选择标签

如果您检查该元素，您将看到vuetify添加了appearance:none，它删除了carot/箭头

但如果您使用的是vuetify，请使用其：

.选择{ 边界半径：3px； 边框：1px实心333； 左：3倍； -webkit外观：menulist！重要；/*覆盖vuetify样式*/ -moze外观：menulist！重要；/*覆盖vuetify样式*/ 外观：menulist！重要；/*覆盖vuetify样式*/ 页边距底部：2rem；/*演示用途*/ } {{item}}

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