web前端-Vue中使用elment的el-table时@row-click与@selection-change

Posted 2021-12-28 MinggeQingchun

Vue中使用elment的el-table标签时，引用了@row-click与@selection-change方法；官方文档中如下显示

 1、el-table事件绑定@selection-change如何自定义传参

<template>
      <el-table
            ref="tableData"
            :data="tableData"
            stripe
            tooltip-effect="dark"
            :header-cell-style="background:'#eef1f6',color:'#606266'"
            border
            @selection-change="(selections)=>handSelectionRules(selections,'参数')"
          >
      <el-table-column type="selection" width="50"></el-table-column>
    </el-table>
</template>

methods:
    handSelectionRules(selections,param)
        console.log(selections,param)   //[],参数
     

 2、@row-click与@selection-change事件冲突

event.cancelBubble = true;

采用阻止冒泡，在字元素中添加可以阻止向上传递触发事件