复制文本到剪切板

实现复制文本到剪切板

使用clipboard.js

引入

• 下载clipboard.js
  地址：https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/1.7.1/clipboard.js
• 在html中引入

html代码

这里使用的是vue的语法，实现是一样的，为实现复制的按钮添加事件
@click是vue里的点击事件，触发copyWx 方法
:data-clipboard-text 是触发要复制的内容

<span class="btn" :data-clipboard-text="items.content" @click="copyWx()">复制</span>

配置

配置都在copyWx的方法里实现

copyWx: function() {
	let clipboard = new Clipboard('.btn');  //实例对象
	clipboard.on('success', function(e) {   //复制成功时执行
		e.clearSelection();
	});
	clipboard.on('error', function(e) {    //复制失败时执行
		console.error('Action:', e.action);
		console.error('Trigger:', e.trigger);
	});
}

赏

谢谢你请我吃糖果

支付宝

微信