解决办法:

通过ref获取div元素

代码:

 <el-button ref="copy" :data-clipboard-text="复制该文字" type="primary" @click="copyCode" size="small">复制</el-button>

mounted(){
            //mounted中初始化实例,解决第一次复制不触发问题
            let copyDomTxt=this.$refs['copy'].$el
            this.clipboard=new Clipboard(copyDomTxt)
        },

copyCode() {
                //解决在vue的弹窗组件中无效,要使用ref获取元素
                // let copyDomTxt=this.$refs['copy'].$el
                // let clipboard = new Clipboard(copyDomTxt)
                //复制成功
                this.clipboard.on('success', ()=> {
                    this.$message.success('复制成功!')
                    this.clipboard.destroy()
                })
                //复制失败
                this.clipboard.on('error', ()=> {
                    this.$message.error('复制失败!')
                    this.clipboard.destroy()
                })
            },

Logo

前往低代码交流专区

更多推荐