PC端与uniapp app端复制内容到剪切板的方法

uniapp 电商app 实现复制内容到剪切板

使用Uniapp的话，有现成的api可以直接调用
下面的这个方法只适用于app端，在H5端是不支持的，H5端可以参考下面的PC端的实现方式

export function copyValue(value){
	uni.setClipboardData({
	    data:value,
	    success: function () {
	        uni.showToast({
	        	title:"复制成功"
	        })
	    },
		fail: function () {
	        uni.showToast({
	        	title:"复制失败"
	        })
		}
	});
}

PC端实现复制内容到剪切板

//此函数的调用就是  @click="copyTitle('内容')"

copyTitle(txt) {
   var input = document.createElement("input"); // 创建一个新input标签
    input.setAttribute("readonly", "readonly"); // 设置input标签只读属性
    input.setAttribute("value", txt); // 设置input value值为需要复制的内容
    document.body.appendChild(input); // 添加input标签到页面
    input.select(); // 选中input内容
    input.setSelectionRange(0, 9999); // 设置选中input内容范围
    document.execCommand("copy"); // 复制
    document.body.removeChild(input);  // 删除新创建的input标签
    //此处的this.$notify是封装好的一个弹窗组件，你可以直接使用其他的组件，只是提示作用。
    this.$notify({
        title: '已复制到剪切板'
    })
}