在用uniapp写项目时,总会遇到一些需求是无法在app端和h5端同时实现的,这时候就需要两端分开写,比如经常遇到的复制剪切的功能:
app端:
这里用到的方法 setClipboardData 和 getClipboardData 可以参考一下官网的详细介绍 https://uniapp.dcloud.io/api/system/clipboard
coypLink(data) {
uni.setClipboardData({
data: data,
success: function() {
uni.showToast({
title: '复制成功!',
icon: 'none'
})
},
fail: function() {
uni.showToast({
title: '复制失败!',
icon: 'none'
})
}
});
uni.getClipboardData({
success: function(res) {
console.log(res.data);
}
});
}
h5端:
setClipboardData(data) {
return new Promise((success, fail) => {
// #ifndef H5
uni.setClipboardData({
data,
success,
fail
})
// #endif
// #ifdef H5
const textarea = document.createElement('textarea');
textarea.value = data
textarea.readOnly = true
document.body.appendChild(textarea)
textarea.select()
textarea.setSelectionRange(0, data.length)
document.execCommand('copy')
textarea.remove()
success(data)
// #endif
})
},
copyLink(content){
this.setClipboardData(content).then((res) => {
if(res == ''){
uni.showToast({
title:'复制失败!',
icon:'none'
})
}else{
uni.showToast({
title:'复制成功!',
icon:'none'
})
}
})
}
以上代码可以直接复制使用,亲测有效
如有问题,欢迎留言!!