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>
相关推荐
像我这样帅的人丶你还5 分钟前
MCP + npm:给五年前的老系统接上AI
前端·javascript·agent
南一Nanyi12 分钟前
依赖注入和控制反转
前端·设计模式·nestjs
小村儿12 分钟前
连载14-实战篇--一个半月,我一个人和 Claude Code 搭出一套数字人工程
前端·后端·ai编程
愚公移码23 分钟前
蓝凌EKP18产品:流程虚拟机(PVM)
java·开发语言·前端
promiseThen42 分钟前
5 分钟上手 Markdown:标题到表格、代码块与简历实战
前端
web66liang44 分钟前
webpack4+vue2项目使用 sass-embedded 导致的 DockerfIle 构建失败的问题
前端
Larcher1 小时前
LangChain RAG 排错实录:.env 为什么没有生效
vue.js·后端
Strayer1 小时前
拓扑管网 3D 可视化大屏demo:科技感(地图 + 拓扑 + 3D 空间)
前端·three.js·数据可视化
葬送的代码人生1 小时前
从 Vue 到 React:Tailwind CSS 布局 + BFF 代理实战
前端·react.js·架构
摸鱼老王不带81 小时前
不用后端,纯前端读出"网站眼里你的真实出口 IP"——聊聊 Cloudflare 的 cdn-cgi/trace
前端