使用原生js实现项目中,点击文字复制功能

   // 复制文本
    copyTixt() {
    //this.data  是文字内容,因为使用vue 所有可以直接用this获取
      let data = this.data
      let oInput = document.createElement('input')
      oInput.value = data
      document.body.appendChild(oInput)
      oInput.select() // 选择对象;
      // console.log(oInput.value)
      document.execCommand('Copy') // 执行浏览器复制命令
      this.$message.success('复制成功')
      oInput.remove()
    },

html 绑定这个方法即可

 <div @click="copyTixt" class="pwetext">
        <span>{{data}}</span>
 </div>

这个复制文本的思路,利用 document.execCommand(‘Copy’) 浏览器复制命令,因为是对input 才可操作
所以创建了input 的DOM接点,给inptu添加内容,然后使用select()选择对象内容.执行浏览器复制命令,
操作完以后,删除之前创建的input接点