Vue element-ui el-table阻止行选事件

我们经常会在某个table末尾加上操作列来放置button来处理跳转和其他的逻辑
那么当点击button的时候同样也会执行在el-table 设置的 @row-click="handleRowClick"事件。如果避免这种情况呢?
其实很简单,在操作列的加上@click.stop就可以了

<el-table @row-click="handleRowClick :data="dataList">
       <el-table-column header-align="left" align="left" label="操作">
            <template slot-scope="scope">
              <el-button
                size="mini"
                type="text"
                @click.stop
                @click="handleView(scope.row)"
              >查看</el-button>

              <el-button
                v-else
                size="mini"
                @click.stop
                @click="handleProcess(scope.row)"
              >处理</el-button>
            </template>
        </el-table-column>
<el-table>

这样就可以避免执行handleRowClick事件了

Keep learning
原文地址:https://www.cnblogs.com/leslie1943/p/13359596.html