elementui中table表头列有排序，但增加勾选框后，勾选事件会触发排序

paradise0813

已于 2022-06-02 13:39:10 修改

阅读量502

点赞数

文章标签：前端

于 2021-10-10 21:34:46 首次发布

本文链接：https://blog.csdn.net/qq_38693333/article/details/120692844

版权

elementui中table表头列有排序，但增加勾选框后，勾选事件会触发排序

此时需要屏蔽表头列的冒泡事件，可以使用click.stop来解决此问题

<el-table :data="tableData">
    <el-table-column v-for="(h, i) in tableHeader" :key="Math.random()" sortable :prop="h.prop">
        <template slot="header" slot-scope="scope">
            <span @click.stop>
                <el-checkbox v-model="h.select">
                </el-checkbox>
                <span>{{h.title}}</span>
            </span>
        </template>
    </el-table-column>
</el-table>