如何让 append-outer-icon 在 vuetify 中工作？

Question

v-select 允许添加 append-outer-icon 但如何在单击此项时强制展开图标列表？

 <v-select                
        :items="selectItems.position"
        v-model="selectedPosition"            

        clear-icon="highlight_remove"  
        append-icon="unfold_more"
        append-outer-icon="unfold_more"
        @click:append-outer="openSelect"                                                                  
        >

@click:append-outer 允许添加回调函数，但我在 openSelect 中做了什么来扩展项目列表？

Answer 1

您应该将 ref 添加到您的 v-select 元素。然后将此 ref 用于您的 openSelect 函数：

<template>
    <v-select
        ref="theSelect"

        :items="selectItems.position"
        v-model="selectedPosition"

        clear-icon="highlight_remove"
        append-icon="unfold_more"
        append-outer-icon="unfold_more"
        @click:append-outer="openSelect"
    />
</template>

<script>
    export default {
      methods: {
        openSelect () {
          this.$refs['theSelect'].onClick()
        }
      }
    }
</script>

如何让 append-outer-icon 在 vuetify 中工作？

How to get append-outer-icon working in vuetify?

vuetify.js

v-select