# 剪贴板复制插件
vue剪贴板复制插件
在网络上简单复制,具有最大的浏览器兼容性。
# 安装
npm install clipboard-polyfill
1
# 使用
import * as clipboard from "clipboard-polyfill/text";
function handler() {
clipboard.writeText("我是复制的内容").then(
() => { console.log("success!"); },
() => { console.log("error!"); }
);
}
window.addEventListener("DOMContentLoaded", function () {
const button = document.body.appendChild(document.createElement("button"));
button.textContent = "Copy";
button.addEventListener("click", handler);
});
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
2
3
4
5
6
7
8
9
10
11
12
13
14
15
# 浏览器支持
- ☑️:浏览器具有本机异步剪贴板支持。
- ✅:
clipboard-polyfill
增加支持。 - ❌: 不支持。
- 粗体浏览器名称表示现代浏览器稳定版本的最新功能更改。
由最早的浏览器版本编写支持:
Browser | writeText() | write() (HTML) | write() (other formats) |
---|---|---|---|
Safari 13.1 | ☑️ | ☑️ | ☑️ (image/uri-list , image/png ) |
Chrome 86ᵃ / Edge 86 | ☑️ | ☑️ | ☑️ (image/png ) |
Chrome 76ᵃ / Edge 79 | ☑️ | ✅ | ☑️ (image/png ) |
Chrome 66ᵃ / Firefox 63 | ☑️ | ✅ | ❌ |
Safari 10 / Chrome 42ᵃ / Edgeᵈ / Firefox 41 | ✅ | ✅ | ❌ |
IE 9 | ✅ | ❌ | ❌ |
阅读支持:
浏览器 | readText() | read() (HTML) | read() (其他格式) |
---|---|---|---|
Safari 13.1 | ☑️ | ☑️ | ☑️( image/uri-list , image/png ) |
Chrome 76 (opens new window) ᵃ / Edge 79 | ☑️ | ❌ | ☑️( image/png ) |
Chrome 66 (opens new window)ᵃ | ☑️ | ❌ | ❌ |
IE 9 | ✅➜ | ❌ | ❌ |
火狐 | ❌ | ❌ | ❌ |