I couldn’t find a way to prevent scrolling of v-select
in Vuetify 3. It was optional in Vuetify 2 with :menu-props="auto"
. I have a demo here. Code is like below:
<template>
<v-app>
<v-container>
<v-select v-model="selected" :items="items" />
</v-container>
</v-app>
</template>
<script setup>
import { reactive } from 'vue'
import { ref } from 'vue'
const selected = ref('item10')
const items = reactive([
'item1',
'item2',
'item3',
'item4',
'item5',
'item6',
'item7',
'item8',
'item9',
'item10',
'item11',
])
</script>
How can I prevent auto-scrolling after I expand component?
I tried programatically prevent scrolling with using ref. ChatGPT suggested using this.$refs.selector.$refs.menu.scrollTop = 0
but selector does not have any $refs
.