admin管理员组

文章数量:1344546

I am using Vuetify's component in my Vue 3 project. However, I am facing an issue with screen readers (tested with NVDA and VoiceOver). When a user selects an option and then moves focus to the next element (like a button), the screen reader first announces the previously selected item before announcing the next focused element.

<template>
  <v-app>
    <v-container>
    <button>Click me</button>
      <v-select
        label="Select"
        :items="['California', 'Colorado', 'Florida', 'Geia', 'Texas', 'Wyoming']"
      ></v-select>
      <button>test</button>
    </v-container>
  </v-app>
</template>

<script setup>
  import { ref } from 'vue'

  const msg = ref('Hello World!')
</script>

Observed Behavior: When using a screen reader (NVDA or VoiceOver), after selecting an item from and pressing Tab to move focus to the , the screen reader first announces the previously selected item before reading "test" (the button label).

This issue consistently happens with Vuetify's , but not with native elements.

Expected Behavior: The screen reader should directly read the label of the focused element (the button) without repeating the previously selected item.

本文标签：

版权声明：本文标题：vue.js - Vuetify v-select: Screen reader announces previous item first when focusing on the next element - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1743797603a2540716.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。