当前位置: 首页 > article >正文

Blocked aria-hidden on an element because its descendant retained focus.

 在使用el-popover和el-radio-group实现弹窗选择数据后调用el-popover的doClose()方法时一直报错!

经过分析发现el-popover及el-radio__original有aria-hidden属性,具体aria-hidden属性应用自行搜索了解。既然是这个玩意引起的,则在显示时将aria-hidden属性移除掉即可:

<div class="flex-row l-flex l-hover" style="position: relative;" :class="{ 'nl-flex': relative == 'or' }">
            <el-popover placement="bottom" ref="refPop" width="80" trigger="hover" class="h-100 flex-row"
                popper-class="pop-grid-view" @show="popshow">
                <el-radio-group  v-model="radio" @input="radioChanged">
                    <el-radio :label="item.value" v-for="item in optionsList">{
   
   { item.label }}</el-radio>
                </el-radio-group>
                <el-image slot="reference" style="width: 20px; height: 20px"
                    :src="require('@/assets/images/sameR.png')"></el-image>
            </el-popover>
            <el-image class="m-view" :src="require('@/assets/images/downArrow.png')"></el-image>
        </div>

给el-popover添加@show="popshow"方法,显示后移除相应的属性!

 popshow() {
            var ariaEls = document.querySelectorAll('.el-popover')
            ariaEls.forEach((item) => {
                item.removeAttribute('aria-hidden')
            })
            
            ariaEls = document.querySelectorAll('.el-radio__original')
            ariaEls.forEach((item) => {
                item.removeAttribute('aria-hidden')
            })
        },

世界一下子干净了好多 


http://www.kler.cn/a/538116.html

相关文章:

  • C++20新特性
  • 【报错解决】MySQL报错:sql_mode=only_full_group_by
  • 等级保护2.0|网络安全服务
  • 【C#】一维、二维、三维数组的使用
  • mysql 学习11 事务,事务简介,事务操作,事务四大特性,并发事务问题,事务隔离级别
  • html 列动态布局
  • CASAIM与马来西亚 Perodua汽车达成合作,共推汽车制造质量升级
  • 【C++八股】const和define的区别
  • 在亚马逊云科技上云原生部署DeepSeek-R1模型(下)
  • Spring Boot 多数据源解决方案:dynamic-datasource-spring-boot-starter 的奥秘(上)
  • 基于HTML5 Canvas 的盖楼游戏
  • 大数据治理新纪元:全面解读前沿开源技术的力量
  • DeepSeek——DeepSeek模型部署实战
  • 使用 OpenGL ES 加载图片并写入纹理单元
  • 推理大模型DeepSeek迅速觉醒
  • LeetCode:63. 不同路径 II(DP Java)
  • 腾讯云TI平台×DeepSeek:开启AI超强体验,解锁部署秘籍
  • Linux iftop 命令使用详解
  • 机器学习数学基础:20.方程组解的结构
  • React受控组件的核心原理与实战精要
  • 从0到1深入大数据治理:解锁数据价值的密码
  • Spring Boot 3.4 中 MockMvcTester 的新特性解析
  • 【对比测评】 .NET 应用的 Web 视图控件:DotNetBrowser 或 EO.WebBrowser
  • python实现物体轮廓提取及标注【含源码方案及演示】
  • 尚硅谷课程【笔记】——大数据之Zookeeper【二】
  • Java算法技术文章:深入解析排序、搜索与数据结构