Vue 实现复制到剪贴板功能

项目中需要实现复制到剪贴板的功能，看了一下vue相关的插件，发现了vue-clipboard2但是因为现在项目都是基于Vue 3.0开发，所以不适用，又发现了vue3-clipboard，但是没弄清楚怎么用，所以就想到使用js原生自带的功能，然后就发现了，一种写法：

 

let input = document.querySelector('#demoInput');
input.select();
document.execCommand('copy')

然后在使用过程中，发现了这样写也是可以的：

 

 this.$refs.demoInput.select()
 document.execCommand('copy')

但是在实现的时候遇到难题，那就是如果是disabled，那么复制是不生效的，也试过在document.execCommand('copy')前后，动态设置disabled的值，但是效果并不理想，后来就想着要不写两个吧，然后就看到下面这篇博文：

JS document.execCommand实现复制功能（带你出坑）

具体实现方式如下：

导出到剪贴板

methods: {
        copyClicked() {
            this.$refs.demoInput.select()
            document.execCommand('copy')
        }
}