vue中点击分享图标复制当前页面地址

实现效果 点击分享按钮跳出弹框且复制

 1.安装Clipboard插件

npm install clipboard --save

2.在自己的页面引入插件

import Clipboard from 'clipboard';

3.页面代码template

 <span class="copy flexCenter" @click="copyUrl" :data-clipboard-text="url">
    <img src="../../../static/image/分享.png" alt="" class="img"></span>

4.在data里面定义url地址

url: '',

this.url = window.location.href;