elementui 复制功能,无需下载插件纯原生实现
点击复制按钮实现内容复制
第一种方法:(繁琐)
<div slot="footer" class="dialog-footer"> <el-button @click="show=false" size="mini">关 闭</el-button> <el-button @click="handleSubmit()" size="mini" type="primary">复制</el-button> </div> handleSubmit() { let name = this.processModelInfo.name; //每一行的某个值,如选中的当前行的url let key = this.processModelInfo.key; var input = document.createElement(input); //创建一个隐藏input(重要!) input.value = name+,+key; //拼接多个赋值 document.body.appendChild(input); input.select(); // 选择对象 document.execCommand("Copy"); // 执行浏览器复制命令 input.className = oInput; input.style.display=none; this.$message.success("复制成功!") }
第二种方法:(简化)
<div slot="footer" class="dialog-footer"> <el-button @click="show=false" size="mini">关 闭</el-button> <el-button @click="handleSubmit()" size="mini" type="primary">复制</el-button> </div> handleSubmit() { let name = this.processModelInfo.name; //每一行的某个值 let key = this.processModelInfo.key; var copyContent = document.createElement(input); //创建一个隐藏input(重要!) copyContent.value = name + "," + key; //拼接多个赋值 document.body.appendChild(copyContent); copyContent.select(); // 选择对象 document.execCommand("Copy"); // 执行浏览器复制命令 this.$message.success("复制成功!"); copyContent.remove(); }
上一篇:
IDEA上Java项目控制台中文乱码