el-table 个体行绑定点击事件时 表格中有el-radio和el-checkbox 点击触发两次事件处理方法

前言

el-table 个体行绑定点击事件时 表格中有el-radio和el-checkbox 点击触发两次事件处理方法

一、问题重现 当不点击单选按钮时 就正常不会出问题 当点击单选框时点击事件会执行两次

<el-table
    v-bind="$attrs"
    v-on="$listeners"
    ref="singleTable"
    border
    size="mini"
    highlight-current-row
    @row-click="onRows">
    <el-table-column  width="35" >
      <template slot-scope="scope">
        <el-radio  :label="scope.row" v-model="radioRow">&nbsp;</el-radio>
      </template>
    </el-table-column>
    <slot></slot>
</el-table>

二、解决方式

代码如下(示例):

// 参数 row col  e 事件
 onRows(row,c, e){
 	// 因为单选框和复选框底层都是input 所以  判断tagName === input 不处理就行
    if (e.target.tagName === 'INPUT') return;
},

你可能感兴趣的:(vue.js,javascript,前端)