vue 使用clipboard实现移动端一键复制

(1)执行命令,我是镜像npm

 cnpm install clipboard --save

(2) main.js中加

import clipboard from 'clipboard';
Vue.prototype.clipboard = clipboard;

(3) .vue文件

      <yd-cell-group>
        <yd-cell-item>
          <yd-textarea slot="right" placeholder="此处生成API链接"  v-model="link"></yd-textarea>//要输入框的内容
        </yd-cell-item>
        <div class="buy_btn2">
          <yd-button
            size="small"
            type="primary"
            shape="circle"
            @click.native="copyRes" //触发函数
            class="api_btn1" //获取dom
            data-clipboard-action="copy" //必加
            :data-clipboard-text="link(复制的内容)" //必加
          >复制链接</yd-button>
        </div>
      </yd-cell-group>

    //复制函数
      copyRes() {
      let _this = this;
      let clipboardObj = new this.clipboard(".api_btn1");
      clipboardObj.on("success", function() {
        _this.$dialog.notify({
          mes: "已复制到黏贴版,快去使用吧",
          timeout: 5000,
          callback: () => {
            console.log("我走咯！");
          }
        });
      });
      clipboardObj.on("error", function() {
        _this.$dialog.notify({
          mes: "复制失败",
          timeout: 5000,
          callback: () => {
            console.log("我走咯！");
          }
        });
      });
    },

(4) 我用的yd是UI框架，不需要复制，拿函数就行