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

清风拂山感2024-07-12 22:24

说明：

最近有个不想说的（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
}

特此记录，已便下次快速的拷贝！