解决clipboard.js在vue的弹窗组件中无效或者首次点击无效
解决办法:通过ref获取div元素代码:<el-button ref="copy" :data-clipboard-text="复制该文字" type="primary" @click="copyCode" size="small">复制</el-button>mounted(){//mounted中初始化实例,解决第一次复制不触发问题let copyDomTxt=this
·
解决办法:
通过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()
})
},
更多推荐
已为社区贡献4条内容
所有评论(0)