欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

复制内容到剪切板

程序员文章站 2022-06-16 10:26:37
...

需求:

点击按钮的时候会向后端发送请求,获取appkey,并且把appkey复制到剪切板上

实现:

<template>
  <div id="app">
    <el-button type="primary" @click="getApk">获取我的appkey</el-button>
  </div>
</template>
<script>
export default {
  name: "",
  data() {
    return {
      appkey: "",
    };
  },
  methods: {
    // 获取apk
    getAppkey() {
      if (!this.appkey) {
        this.$get("/project/editor/getMyAppKey").then(data => {
            this.appkey = data;
            this.copyappkey();
          })
          .catch(err => {
            this.$message.error("获取失败,请重试!");
            return err;
          });
      } else {
        this.copyAppkey();
      }
    },
    // copyapk
    copyAppkey() {
      let input = document.createElement("input");
      input.value = this.appkey;
      document.body.appendChild(input);
      input.select(); //获取对象
      document.execCommand("copy"); //执行浏览器复制命令
      input.style.display = "none";
      this.$message.success("appkey已成功复制到剪切板");
    },
  }
};
</script>

相关标签: vue.js javascript