role-alertdialog(可以自动读屏 安卓无效) alertdialog显示时,屏幕阅读器会查找描述文字来报读
role-dialog 浏览器会告知屏幕阅读器一个对话框已打开
aria-modal="true" 对话框以外的内容 点击的时候 无法被聚焦
tabindex="-1" 可以使一个对话框被聚焦 (安卓一定要加
aria-label / aria-labelledby 指定读屏阅读器读的内容
安卓对话框聚焦:
<div v-show="value" class="boxCon" ref="custModal" tabindex="-1" aria-modal="true">
这是一个弹窗
</div>
在自己的open方法里面设置focus
open() {
this.$nextTick(() => {
this.$refs.custModal.focus()
})
}
参考: