elementui的table的@selection-change阻止事件改变

说明:

最近有个不想说的(xxx)业务,在表格勾选每一行的时候要触发一系列查询功能,查询失败还要把那个勾勾回退。真实蛋疼!表格勾选的默认@selection-change是change事件,一般change事件是在完成之后才触发,不能在触发之前进行阻止操作。想了想,查了查,各种神仙操作,算了不看了脑瓜疼!就想通el-checkbox来代替表格原生的@selection-change事件咯,反正都是多选!安排!

1、案例

java 复制代码
<el-table
    ref="multipleModeTable"
    :data="modeList"
    tooltip-effect="dark"
    height="200"
    style="width: 100%;">
    <el-table-column
    type="selection"
    width="55">
    <template slot-scope="scope">
        <el-checkbox v-model="scope.row.ischeck" @click.native.prevent="handleSelectionChange(scope.row)"></el-checkbox>
    </template>
    </el-table-column>
    <el-table-column
    :label="$t('message.label_mode_chs')">
    <template slot-scope="scope">{{ scope.row.mode }}</template>
    </el-table-column>
</el-table>

//-----------多测试多体验-------------
handleSelectionChange(e){
    // 做其他相关操作...
    // 不想勾选就返回false
    return false
}

特此记录,已便下次快速的拷贝!

相关推荐
jojo是只猫24 分钟前
前端vue对接海康摄像头流程
前端·javascript·vue.js
10年前端老司机4 小时前
React无限级菜单:一个项目带你突破技术瓶颈
前端·javascript·react.js
阿芯爱编程9 小时前
2025前端面试题
前端·面试
前端小趴菜0510 小时前
React - createPortal
前端·vue.js·react.js
晓131310 小时前
JavaScript加强篇——第四章 日期对象与DOM节点(基础)
开发语言·前端·javascript
菜包eo10 小时前
如何设置直播间的观看门槛,让直播间安全有效地运行?
前端·安全·音视频
烛阴11 小时前
JavaScript函数参数完全指南:从基础到高级技巧,一网打尽!
前端·javascript
军军君0111 小时前
基于Springboot+UniApp+Ai实现模拟面试小工具四:后端项目基础框架搭建下
spring boot·spring·面试·elementui·typescript·uni-app·mybatis
chao_78912 小时前
frame 与新窗口切换操作【selenium 】
前端·javascript·css·selenium·测试工具·自动化·html
天蓝色的鱼鱼12 小时前
从零实现浏览器摄像头控制与视频录制:基于原生 JavaScript 的完整指南
前端·javascript