import { Message } from 'ant-design-vue';
export default { //
/*
bind
el: dom
value: copy
*/
bind(el, { value }) {
el.$value = value; //
el.handler = () => {
if (!el.$value) {
// ant-design-vue
Message.warning(' ');
return;
}
// textarea
const textarea = document.createElement('textarea');
// textarea readonly iOS textarea
textarea.readOnly = 'readonly';
textarea.style.position = 'absolute';
textarea.style.left = '-9999px';
// copy textarea value
textarea.value = el.$value;
// textarea body
document.body.appendChild(textarea);
//
textarea.select();
// textarea.setSelectionRange(0, textarea.value.length);
const result = document.execCommand('Copy');
if (result) {
Message.success(' ');
}
document.body.removeChild(textarea);
};
// copy
el.addEventListener('click', el.handler);
},
//
componentUpdated(el, { value }) {
el.$value = value;
},
// 指令与元素解绑的时候,移除事件绑定
unbind(el) {
el.removeEventListener('click', el.handler);
},
};
自定义指令 copy
最新推荐文章于 2024-07-06 16:47:02 发布