在uniapp的H5页面中使用复制粘贴功能

在uniapp的H5页面中使用复制粘贴功能

1.安装插件

命令行

npm i clipboard --save

在main.js中加入：

import Clipboard from 'clipboard';

2.在页面中使用

html部分：

<text class="copy_txt" @tap="copy(code)">复制链接分享</text>

js部分：

copy(code) {
				let clipboard = new Clipboard('.copy_txt',{
					text:function(){
						return code
					}
				})
			
				clipboard.on('success',function(e){
					console.info('Action',e.action);
					console.info('Text',e.text);
					console.info('Trigger',e.trigger);
					e.clearSelection();//清除选中的文字的选择状态
					uni.showToast({
						icon:'success',
						title:"复制成功",
						duration:2000
					});
				});
				clipboard.on('error',function(e){
					console.info('Action',e.action);
					console.info('Trigger',e.trigger);
				})
			}
		}

控制台输出了我们打印的结果。

自己在微信中试了一下cv，功能确实实现了。