• 使用****clipboard.js

  • 官网地址:clipboard.js

    npm方式:npm install clipboard --save
    直接引入:使用js引入。

  • 代码
    在组件中引入import Clipboard from "clipboard";
    封装函数:

 copy(val) {
      var clipboard = new Clipboard(`.${val}`);
      clipboard.on("success", () => {
        alert("复制成功!");
        // 释放内存
        clipboard.destroy();
      });
      clipboard.on("error", () => {
        alert("不支持此浏览器");
        // 释放内存
        clipboard.destroy();
      });
 }

注:val为class名

HTML

:data-clipboard-text="message"

在这里插入图片描述

  • 效果如下:
    在这里插入图片描述
  • 兼容性
    在这里插入图片描述
Logo

前往低代码交流专区

更多推荐