当elementUI表格文字设置了省略号显示的时候,复制文字是麻烦事
解决办法:
1. 在<el-table>标签上加上@cell-dblclick="handleDblClick" 方法,这是elementUI带的双击方法
<el-table @cell-dblclick="handleDblClick">
2. 在页面的不起眼的位置加上一个输入框或者textarea
<!-- 单击复制需要改输入框,隐藏了 -->
<textarea id="input" style="position: absolute;top: 0;left: 0;opacity: 0;z-index: -10;">这是幕后黑手</textarea>
3. 方法里贴上这段代码
methods: {
// 双击表格复制内容
handleDblClick(row, column, cell, event){
if(column.property){
var text = event.target.innerText
var input = document.getElementById("input");
input.value = text; // 修改文本框的内容
input.select(); // 选中文本
document.execCommand("copy"); // 执行浏览器复制命令
this.$notify.success({
title: `${text}`,
message: `已复制到剪贴板`,
// showClose: false
});
}
},
}
这就完事了,效果如下