clipboard.js vue使用

1、 安装

clipboard.js 官网链接：clipboard.js — Copy to clipboard without Flash

npm install clipboard --save  

2、demo：

<template>
	<view>
		<view>{{text}}</view>
        <!-- data-clipboard-text 属性 放需要复制的内容变量-->
		<button class="uni-btn" :data-clipboard-text="text" @tap="copy">点击复制</button>
	</view>
</template>

<script>
    // 先通过npm安装组件clipboard
    // 引用组件
	import Clipboard from "clipboard";
	export default {
        // 注册组件
		components: {
			Clipboard
		},
		data() {
			return {
				text:""
			};
		},
		onLoad(){
			this.text = "123456789"
		},
		methods: {
			
			copy() {
                // .uni-btn 点击复制按钮的class
				let clipboard = new Clipboard(".uni-btn");
				console.log(clipboard)
				clipboard.on("success", e => {
					// 释放内存
					clipboard.destroy();
				});
				clipboard.on("error", e => {
					// 不支持复制
					Message({
						message: "该浏览器不支持自动复制",
						type: "warning"
					});
					// 释放内存
					clipboard.destroy();
				});
			}
			
		}
	}
</script>