el-table懒加载树形数据，实现整行点击的展开_el-table 如何触发load-程序员宅基地
做项目遇到一个需求，根据集团层级展现一组数据，每个层级都可以点开看更详细的拆分数据，第一想法是用el-table的树形数据来展示，大概下面这个样子：
用过这个组件的应该知道这个只能通过点击每一行前面的小箭头实现伸缩，箭头有点小，而且表格一行的数据很长时，对用户的操作不是很友好，所以想能够点击一行的任意位置都可以进行伸缩。
1、官网中的toggleRowExpansion方法如下：
<el-table
:data="tableData"
ref="refTable"
style="width: 100%"
@row-click="expandChange"
>
</el-table>
expandChange(row,index,e){
this.$refs.refTable.toggleRowExpansion(row)
}
但是项目中由于数据量比较大，用了懒加载，即每次点击的时候都会去请求load接口，才能渲染下层数据，这种情况下如果没请求下级，组件的toggleRowExpansion就不好用了。
2、继续搜索，发现有一种修改css的方法，通过拉宽下拉箭头的覆盖区域实现，参见这个https://segmentfault.com/q/1010000038968399
但还是有2个问题，一个是看不到箭头了，二是只能通过点击第一列的文字实现，还是不符合预期。
3、最终通过原生的方法找到箭头的dom元素，触发一次click事件，具体实现方式如下：
<el-table
:data="detailData"
row-key="id"
lazy
:load="load"
:tree-props="{ children: 'children', hasChildren: 'hasChildren'}"
@row-click="(row,column,e)=>clickRowLoad(row,column,e)">
</el-table>
//点击整行load
clickRowLoad(r, c, e){
console.log(e.currentTarget)
if(e.currentTarget.firstElementChild.firstElementChild.firstElementChild.tagName=='DIV'){
e.currentTarget.firstElementChild.firstElementChild.firstElementChild.click()
} else {
e.currentTarget.firstElementChild.firstElementChild.firstElementChild.nextElementSibling.click()
}
},智能推荐
在vector中，怎样删除某个指定值的元素_vector删除指定值-程序员宅基地
文章浏览阅读1.1w次。【在vector中，怎样删除某个指定值的元素】Vectors provide no operation to remove elements directly that have a certain value. You must use an algorithm to do this.一.删除所有满足条件的元素For example, the following statemen_vector删除指定值
自动化测试工具Parasoft vs VectorCAST/C++谁更全？一起来看看_vectorcast和parasoft 对比-程序员宅基地
文章浏览阅读1.2k次。你知道测试金字塔吗？为了用开发实践来扩大测试规模，如何以正确的数量设计合适类型的自动化测试？测试金字塔是一个很好的指南！Parasoft测试金字塔 虽然测试自动化金字塔为高效的测试自动化策略提供了一个蓝图，但你不能把测试质量融入到应用程序中。金字塔需要建立在坚实的基础上，进行深度的代码分析，专注于识别和预防可靠性和安全性问题。Parasoft测试金字塔，如下图所示，展示了Parasoft如何帮助每个级别的测试解决方案。本文是自动化测试工具Parasoft功能对比之C++测试篇之一，将介绍_vectorcast和parasoft 对比
系统清理维护与安全防护软件_404软件下载窗口-程序员宅基地
文章浏览阅读135次。软件介绍：IObit Advanced SystemCare，系统清理维护与安全防护软件，大幅提升整体系统性能和安全！一键AI智能模式，全面扫描优化修复系统，拥有性能加速模式、系统优化、网络加速、启动项优化、软件更新、实时监视清理、隐私安全保护等功能，可以防病毒及间谍软件，浏览器跟踪保护隐私，保护电脑免受病毒攻击。更新日志：iobit.com/en/advancedsystemcarepro.php2021.3.19 v14.3.0.239Advanced SystemCare _404软件下载窗口
Lua中table的ipairs和pairs以及function的:和.区别_lua table ipairs-程序员宅基地
文章浏览阅读359次。转自：csdn火木达人Lua中table遍历ipairs和pairs的区别pairs()函数基本和ipairs()函数用法相同, 区别在于pairs()可以遍历整个table, 即包括数组及非数组部分.ipairs()函数用于遍历table中的数组部分.[plain] view plain copylocal tableA = {_lua table ipairs
彩虹易支付 9.27 最新版加订单查询 sy 更新版_彩虹易支付如何更新-程序员宅基地
文章浏览阅读505次。彩虹易支付 9.27 最新版加订单查询 sy 更新版_彩虹易支付如何更新
iOS. iphone/iPad中的尺寸、安全区，导航高度、机型判断_750脳1206-程序员宅基地
文章浏览阅读1.5w次。参考：http://www.25xt.com/appsizeiphone：===========http://www.tuyiyi.com/cc/*************APP图标：20px，29px，40px，60px／（@2x,@3x）tablviewcell的默认高度------44p'x；statuebar:20--------navigatio..._750脳1206
随便推点
毕业季-关于就业和择业_写出你目前关于就业择业和未来发展的困惑(不少于300字)-程序员宅基地
文章浏览阅读729次。大家好，我是山鸡，现在已经到了大家紧张的准备毕业论文，完成毕业设计，开始答辩的时候了。准备毕业，到毕业答辩这个时间段里，可以说是非常快的，紧张的准备各种材料，画图画表，让你在短时间内，集合你之前的所学知识，集中体现到一篇论文上面，这任务量，可想而知。下面我来说说就业与择业就业刚刚毕业，应该是你在实习之后，正式进入工作岗位的第一步，之前的实习都是小试牛刀，实习的时候，同事都会把你当学生看待， 对..._写出你目前关于就业择业和未来发展的困惑(不少于300字)
LayUi会议OA之我的会议_我的会议列表直播列表 ui-程序员宅基地
文章浏览阅读337次。目录一、我的会议SQL语句编写二、我的会议后端三、我的会议前端 5、运行效果： 2、我的会议Dao3、使用junit测试我的会议方法 2、这里的会议排座由文字转换为图片需要用到layui的自定义模板2.1先进入官方文档找到数据表格 3、由于排座图片会报路径问题，我们需要将项目名删掉双击点开 把项目名去掉......_我的会议列表直播列表 ui
python弹窗点击是否_Python：Pyppeteer点击弹出窗口-程序员宅基地
文章浏览阅读731次。如果有人会发现这个有用，这是我基于接受的答案的Python实现：import asyncioimport timefrom pyppeteer import launchfrom pyppeteer.errors import TimeoutErrorfrom urllib.parse import urlparseURLS = ['https://www.trustarc.com/']start..._pyppeteer是否点击了
什么是MVC和Web Api，以及他们两者的区别！_mvc和api的区别-程序员宅基地
文章浏览阅读3k次，点赞2次，收藏7次。一、什么是MVCMVC全名是Model View Controller，是模型(model)－视图(view)－控制器(controller)的缩写，一种软件设计典范，用一种业务逻辑、数据、界面显示分离的方法组织代码，将业务逻辑聚集到一个部件里面，在改进和个性化定制界面及用户交互的同时，不需要重新编写业务逻辑。MVC被独特的发展起来用于映射传统的输入、处理和输出功能在一个逻辑的图形化用户界面的结构中。在MVC设计模式中： Model是指要处理的业务逻辑和数据操作，它接收视图请求的数据并返回最终的处理_mvc和api的区别
大众点评数据：2023年9月全国全品类大众点评数据，涉及468个品类，包括诸如美食、购物、酒店、商场等等数据。数据用途：适用于行业分析、店铺选址、高校科研等等。数据字段：包括店铺详情、评论推荐、优-程序员宅基地
文章浏览阅读117次。购买流程：购买之前说明所需品类、区域，我们将按需报价。标价不是售价带需求来私，保证相对价格最低，字段相对最全。大众点评数据：2023年9月全国全品类大众点评数据，涉及468个品类，包括诸如美食、购物、酒店、商场等等数据。数据字段：包括店铺详情、评论推荐、优惠活动、位置信息等四大板块字段，内涵明细字段。数据用途：适用于行业分析、店铺选址、高校科研等等。
SpringBoot2 整合 Drools规则引擎，实现高效的业务规则_drools使用spring bean-程序员宅基地
文章浏览阅读2.6k次，点赞3次，收藏15次。Drools是一个基于java的规则引擎，开源的，可以将复杂多变的规则从硬编码中解放出来，以规则脚本的形式存放在文件中，使得规则的变更不需要修正代码重启机器就可以立即在线上环境生效。具有易于访问企业策略、易于调整以及易于管理的特点，作为开源业务规则引擎，符合业内标准，速度快、效率高。..._drools使用spring bean