【Element】在table中使用el-checkbox单击事件会触发两次

问题描述

在element的table中 使用checkbox 的单击事件,会导致checkbox的单击事件触发两次

 <div class="companyList">
        <el-table
          ref="multipleTable"
          :data="companyList"
          tooltip-effect="dark"
          @cell-click="edit"
        >
         <el-table-column prop="status" label="启用" width="80px">
            <template slot-scope="scope">
              <div @click.stop="enable($event,scope.row.status,scope.row.id)">
                <el-checkbox v-model="scope.row.status"/>
              </div>
            </template>
          </el-table-column>
       </table>
</div>        

---

原因分析：

单击事件会触发两次，一次在label标签上，一次在input标签上

---

解决方案：

禁用span/input中 一次单击事件的触发即可

if (e.target.tagName !== 'INPUT') return

if (e.target.tagName !== 'SPAN') return