bs-clipboard

 <el-button :data-clipboard-text="dataClipboardText"
        class="copyclip"
        type="primary"
        style="width: 30%"
        icon="el-icon-document-copy"
        plain
        @click.prevent="handleChangeFieldCopy">复制</el-button>

dataClipboardText:null,

    handleChangeFieldCopy(){
    this.dataClipboardText=this.config.actexp1Field.checkedFields.join(',');
       this.$emitter.emit('on-clipboard',{});
    },

app vue 里面实现


 onEmitterClipboard() {
      // <button class="copyclip" data-clipboard-text="被复制的内容">
      //   btn
      // </button> 
      // this.$emitter.emit('on-clipboard',{});
      let that = this;
      that.$emitter.on("on-clipboard", (options={}) => {
        //dataT
        loadjs.ready("clipboard", function () {
          if (that.clipboard) that.clipboard.destroy();
          that.clipboard = new ClipboardJS('.copyclip', {
            text: function (trigger) {
              let valueT = trigger.getAttribute('data-clipboard-text');
              if (trigger.getAttribute('qt2db')) {
                return that.$crypto.decryptByDES(valueT) || valueT;
              }
              return valueT;
            }
          });
          that.clipboard.on('success', function (e) {
            if (that.clipboardAlt === false) {
              that.$msgBox.success((options||{}).tipSuccess||'复制成功,黏贴查看');
              that.clipboardAlt = true;
            }
            setTimeout(() => {
              that.clipboardAlt = false;
            }, 2000);
            e.clearSelection();
          });
          //e
          that.clipboard.on('error', function () {
            that.$msgBox.error((options||{}).tipFiail||'复制失败,确认是否有数据');
          });
        });
      });
    },
文档更新时间: 2024-07-16 18:56   作者:admin