原始需求如图所示:
但由于elementui中不支持两种点击事件同时使用,所有修改了需求。
点击文字修改标题,点击单元格可以展示任务详情
点击内容的时候,绑定点击事件
<el-table-column prop="title" label="标题">
<template slot-scope="scope">
<a @click="handleClick(scope.row.id)">{{scope.row.title}}</a>
</template>
</el-table-column>
双击时触发的函数
<el-table
style="width: 60%"
:data="tableData"
border
@row-dblclick="handledbClick"
>
</el-table>
//js部分
async handledbClick(row, column) {
// 如果是负责人 则双击显示修改负责人弹出框
console.log('表格行双击')
if (column.label == "负责人") {
this.dialogVisibleUpdateUser = true;
this.user.taskId = row.id; //任务id
if (this.userDate.length) return; //如果已经获取过负责人 则不会再次请求。
// 发送请求 获取所有的负责人。
let res = await getAllUser();
if (res.code == 200) {
this.userDate = res.data;
}
return;
}
}