el-radio 点击报错 Element with focus: inputAncestor with aria-hidden....

一、序言

浏览器版本影响的问题(与代码无关,可能是web或浏览器相关协议更新导致),不影响功能的使用.

翻译:元素上的Blocked aria-hidden,因为刚刚接收焦点的元素不能对辅助技术用户隐藏。避免在焦点元素或其祖先元素上使用aria-hidden。考虑使用惰性属性,这也会阻止焦点。有关更多详细信息,请参见 WAI-ARIA规范 的aria隐藏部分。

二、配置全局方法 main.js

复制代码
// 解决el-radio报错
Vue.directive('removeAriaHidden', {
  bind(el, binding) {
    let ariaEls = el.querySelectorAll('.el-radio__original');
    ariaEls.forEach((item) => {
      item.removeAttribute('aria-hidden');
    });
  }
});

三、使用

复制代码
<el-raido v-model="radio" v-removeAriaHidden></el-radio>

<el-radio-group v-model="radio" v-removeAriaHidden >
     <el-radio :label="1" >1</el-radio>
     <el-radio :label="2">2</el-radio>
 </el-radio-group>
相关推荐
攀小黑2 小时前
vue3+Web Speech API 封装了一个弹窗语音输入
前端·macos·xcode
roamingcode2 小时前
4.5 小时,从一句话需求到可安装的 Chrome 插件:一次 AI 结对开发的完整复盘
前端·人工智能·chrome·claude·codex
meilindehuzi_a2 小时前
LangChain.js 对话 Memory 实战:History 持久化、截断与摘要压缩
java·javascript·langchain
江畔柳前堤3 小时前
具身智能全景深度指南(2026年9月版):从“会聊天的AI“到“能干活的机器“
大数据·javascript·图像处理·人工智能·分布式·智慧城市·原型模式
️学习的小王3 小时前
Windows Claude Code 接入 Playwright‑MCP,调用本机Edge浏览器(避坑完整教程)
前端·windows·edge
liuyicenysabel3 小时前
Grafana + Prometheus 分级告警配置设计(P0/P1/P2)
javascript·grafana·prometheus
律宏阔3 小时前
CloakBrowser 开发踩坑笔记
前端·浏览器
Made in Haven7123 小时前
HTML课程笔记补2
前端·笔记·html
Cry丶3 小时前
Vue 3 业务管理页面实战:组件拆分、父子通信与弹窗复用
前端·javascript·vue.js·父子通信·组件拆分·弹窗复用
雪芽蓝域zzs3 小时前
Vue前端配置路由通配捕获 404
前端·javascript·vue.js