工作任务需要一个复制
- 新建copy.js
export default {
name: 'copy',
hooks: {
inserted(el, { value }) {
el.$msgFn = value.msgFn || ''
el.$value = value.text || value
el.handler = () => {
if (!el.$value) {
el.$msgFn && el.$msgFn('无复制内容')
return
}
const textarea = document.createElement('textarea')
textarea.readOnly = 'readonly'
textarea.style.position = 'absolute'
textarea.style.left = '-9999px'
textarea.value = el.$value
document.body.appendChild(textarea)
textarea.select()
textarea.setSelectionRange(0, textarea.value.length)
const result = document.execCommand('Copy')
if (result) {
el.$msgFn && el.$msgFn('复制成功')
}
document.body.removeChild(textarea)
}
el.addEventListener('click', el.handler)
},
componentUpdated(el, { value }) {
el.$value = value.text || value
el.$msgFn = value.msgFn || ''
},
unbind(el) {
el.removeEventListener('click', el.handler)
}
}
}
- vue中引入
<a
class="tw-btn copyAccount"
v-copy="{
text: accountCode,
msgFn: message => { //复制成功提示,当前使用的是element
$message({ message })
}
}"
>
{{ $t('home.copyAccount') }}
</a>