vue3.0 + clipboard(复制功能)

一键粘贴 （vue3.0+ts）

npm install clipboard // 安装clipboard.js
import Clipboard from ‘clipboard’ // 引入

		<span>{{adminInfo.account}}<span/>
		<el-tooltip
                class="box-item"
                effect="dark"
                content="复制"
                placement="top"
              >
                <code @click="copyText('account')" 
                id="account" 
                :data-clipboard-text="adminInfo.account">
                </code>
                // data-clipboard-text="要复制的内容"
              </el-tooltip>

	<script lang="ts">
		import { defineComponent, reactive, toRefs } from 'vue'
		import Clipboard from 'clipboard'
		import { ElMessage } from 'element-plus'
		
		export default defineComponent({
		  setup() {
		    const state:any = reactive({
		
		    })
		    
	     const copyText =(val:string)=>{
	     // val: 复制按钮的id 
	      let clipboard = new Clipboard('#' + val)
	      clipboard.on('success',e=>{
	       ElMessage({
	          message:'复制成功',
	          type:'success'
	        })
	        clipboard.destroy()
	      })
	      clipboard.on('error',e=>{
	        ElMessage({
	          message:'浏览器不支持复制功能',
	          type:'error'
	        })
	        clipboard.destroy()
	      })
	    }
	    return  {
	      ...toRefs(state),
	      copyText
	    }
	  },
	})
	</script>