js原生方法document.execCommand()复制到粘贴板

素**颜

已于 2022-03-22 13:58:12 修改

阅读量1k

点赞数

文章标签： js vue.js

于 2020-10-15 14:14:35 首次发布

本文链接：https://blog.csdn.net/qq_41919732/article/details/109096094

版权

JavaScript 复制功能一键复制 DOM操作用户交互

关键词由CSDN通过智能技术生成

一键复制

后面的按钮把前面的文字复制到剪切板上，代码如下：
在这里插入图片描述

<div class="copyText" v-if="wxResultPage.wechatID">
	微信号： {{wechatID}}
	<span @click="copy(wechatID)">一键复制</span>
</div>

<script>
 	import {
    	Toast
  	} from 'mand-mobile'
  	
	export default {
		components: {
	      [Toast.name]: Toast
	    },
	    data() {
	      return {
	      	wechatID: 'HR001'
	      }
      	},
		methods:{
			copy(text) {
		        let oInput = document.createElement('input')
		        oInput.value = text
		        document.body.appendChild(oInput)
		        oInput.select()
		        document.execCommand('Copy')
		        Toast({
		          content: '复制成功',
		          duration: 2000
		        })
		        oInput.remove()
			},
		}
	}
</script>