uniapp实现移动端剪切板小功能
在制作移动端支付的项目时用到了剪切板这个功能,uniapp中想要实现这个功能会有一个问题。
-
uni.setClipboardData(OBJECT)
这个方法是用来设置系统剪贴板的内容,这个方法里的object的参数data,是放我们需要设置的内容。当然一般可以在success里打印来看内容是否已经在剪切板里,但不仅有success回调函数,fail回调函数也是可以检测(检测内容没有在剪切板中)。
uni.setClipboardData({
data: 'hello',
success: function () {
console.log('success');
}
fail: function () {
console.log('fail');
}
});
设置剪贴板内容后,小程序平台会自动弹出轻提示,是自带的一个弹窗,如果我们不想要这个弹窗,可以查看文档使用 showToast 设置为 false 将其禁掉。
注意:这个方法需要用在事件里才会执行,因为我在制作项目时,再进页面就直接进行复制,一直都是在fail事件里进行提示;后来放到点击事件内进行触发才执行了success的回调函数。
具体的官方文档上也有详细的剪切板方法介绍:uni-app官网
-
uni.getClipboardData(OBJECT)
这个方法是用来获取系统剪贴板内容,方法参数有success成功回调和fail失败回调还有complete回调,接口调用结束的回调函数(调用成功、失败都会执行)。有设置剪切板的自然会有获取剪切板内容的方法。
注意:如果小程序平台调用发现错误: setClipboardData:fail api scope is not declared in the privacy agreement, 原因是微信小程序于2023年9月15日更新剪切板为必须通过小程序后台配置用户隐私保护指引并审核通过后方可使用该API。