一键复制:clipboard.js
2023-07-21 本文已影响0人
清平乐啊
time:2023.07.22
一、cdn
官网地址
<script src="https://cdn.jsdelivr.net/npm/clipboard@2.0.11/dist/clipboard.min.js"></script>
二、使用
dom
<span id="text">被复制的文字</span>
<button @click="copyLink" data-clipboard-target="#text" id="copyBtn">
复制链接
</abutton>
方法
// 复制链接
copyLink() {
try {
let clipboard = new ClipboardJS('#copyBtn')
clipboard.on('success', function (e) {
e.clearSelection()
alert('复制成功')
})
clipboard.on('error', function (e) {
alert('复制失败')
console.error('clipboard error', e)
})
setTimeout(() => {
clipboard.destroy();// 防止多次alert提示
}, 0)
} catch {
alert('浏览器不支持自动复制,请手动复制或刷新重试')
return
}
},