el-table树形懒加载展开改为点击行展开
思路:获取el-table中小箭头,然后调它的click事件!
<el-table
@row-click="getOpenDetail"
:row-class-name="tableRowClassName"
>
// 点击当前行展开节点
getOpenDetail(row, column, event) {
// 如果是叶子节点或点击的是输入框,不触发展开
//我的行里面有输入框所以加这个判断,没有则忽略
if (row.isListNode === '1' || event.target.tagName.toLowerCase() === 'input') {
return;
}
// 获取展开按钮并触发点击
const expandBtn = event.currentTarget.querySelector('.el-table__expand-icon');
if (expandBtn) {
expandBtn.click();
}
},
//添加鼠标移入鼠标样式
tableRowClassName({row, rowIndex}) {
return 'clickable-row';
},
::v-deep .clickable-row {
cursor: pointer;
// 当鼠标悬停在输入框上时保持默认指针,我的行里面有输入框所以加这个
.el-input-number {
cursor: default;
}
}