在做项目时候遇到了一个问题，

这是一个点击侧栏选项，右侧栏显示数据，但实际操作之后，只有右侧栏点击选中行会高亮，右侧栏不会高亮

可以看到右侧栏和左侧栏都有highlight-current-row，但这个属性和@row-click就不会高亮了。

我不明白为什么会这样。

按照element-ui给的案例

我在左侧栏table 添加了ref

想要通过setCurrentRow方法让他高亮还是不行。

 谁可以解决一下这个问题，万分感谢

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;

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

最近遇到一个问题，当我点击el-table中操作单元格的按钮时，发现el-table写的@row-click这个功能也会一起出现。这是一个点击冒泡的现象，最终找到了解决方法，操作按钮这样写：@click.native.stop就解决啦。

最后贴上一些相关知识：

使用 .native 修饰符，监听根元素的原生事件。加了.native就可以匹配VUE的全局回调函数，变成了一个普通的HTML标签。

希望对和我一样有疑惑的小伙伴有所帮助！说的不是很清楚，如果有不理解的可以自行百度。还有很多修饰符也可以自己去了解呀~