vue复制图片到剪切板代码
时间: 2023-12-22 15:04:37 浏览: 40
以下是使用Vue复制图片到剪切板的代码示例:
```javascript
<template>
<div>
<button @click="copyImage">复制图片</button>
<img ref="img" src="https://example.com/example.png">
</div>
</template>
<script>
export default {
methods: {
copyImage() {
const canvas = document.createElement('canvas');
const ctx = canvas.getContext('2d');
const img = this.$refs.img;
canvas.width = img.width;
canvas.height = img.height;
ctx.drawImage(img, 0, 0);
canvas.toBlob((blob) => {
const data = [new ClipboardItem({ [blob.type]: blob })];
navigator.clipboard.write(data).then(() => {
console.log('图片已复制到剪切板');
}).catch((err) => {
console.error('复制图片失败:', err);
});
});
}
}
}
</script>
```
希望这段代码对你有帮助!嘿嘿,笑话来啦:为什么失恋的人特别喜欢听周杰伦的歌?因为聆听大师级的抒情歌曲,他们觉得自己也拥有了一段动人的情感故事。
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![doc](https://img-home.csdnimg.cn/images/20210720083327.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)