复制功能

先说一下今天出现的一个问题吧

关于复制功能

我先是使用了navigator.clipboard.writeText(文本) 代码如下

<CopyOutlined style={{ color: "#1890ff" }} onClick={() => onCopy(text)} />
// 复制
    const onCopy = async (text) => {
        await navigator.clipboard.writeText(text);
        message.success('复制成功')
        
    }

去实现复制功能。 后来发现，在本地上是可以复制成功的，但是我上测试环境之后又测出来复制不了。后来百度之后才知道，这个方法只在https与localhost环境有效😀。

后来我才开始使用下面的这个方法去实现复制的功能：

1. 需要安装这个Clipboard，

2. 再导入 import Clipboard from "clipboard";

  import Clipboard from "clipboard";

    <CopyOutlined
        id="copyBtn"
        style={{ color: "#1890ff" }}
        data-clipboard-text={text} // 需要复制的文本
        onClick={() => { onCopy() }
    }
      // 复制
    const onCopy = async () => {
        let clipboard = new Clipboard("#copyBtn");
        clipboard.on("success", function (e) {
            message.success('复制成功')
            clipboard.destroy(); // 使用完之后需要销毁，避免内存泄漏
        })
        
    }
/>

所以还是用下面这种吧