js实现点击复制链接功能
像这种复制链接的功能一般我们把他放在utils文件中.代码如下://文本复制exportfunctioncopyText(value){returnnewPromise((resolve)=>{varinput=document.createElement("input");//js创建一个input输入框input.value=value;//将需要复制的文本赋值到创建的input输入框中
像这种复制链接的功能一般我们把他放在utils文件中.
代码如下:
// 文本复制
export function copyText(value) {
return new Promise((resolve) => {
var input = document.createElement("input"); // js创建一个input输入框
input.value = value; // 将需要复制的文本赋值到创建的input输入框中
document.body.appendChild(input); // 将输入框暂时创建到实例里面
input.select(); // 选中输入框中的内容
document.execCommand("Copy"); // 执行复制操作
document.body.removeChild(input); // 最后删除实例中临时创建的input输入框,完成复制操作
resolve();
});
}
在组件中我们如何去使用:
直接引入:import { copyText } from "@/utils/utils.js";
使用button按钮也可: <MenuItem @click="copy(mouseRightItem)" >复制链接</MenuItem>
mouseRightItem----我这里传的是一个对象,本质上也是取其中的链接,直接传链接名也可.
然后在组件写一个方法即可:
// 复制链接
copy(item) {
const { value } = item;
console.log(value);
copyText(value.material_content.address).then(() => {
this.$message.success({ message: "地址复制成功" });
});
},
------------红色的数据就是链接地址
更多推荐
所有评论(0)