vue中点击按钮复制文本的实现

这两天写项目的时候有一个点击按钮复制文本的需求，完成之后把过程记录一下
首先是搜索有没有相关的现成的lib
搜索得到这个clipboardjs
这个库的具体用法也都写在官方文档中了，下面看在vue中如何集成这个库完成需求

template

<van-button
  ref="copyBtn"
  data-clipboard-text="要复制的文本">
  点击复制
</van-button>

script

export default {
  data() {
    return {
      token: '',
    };
  },
  mounted() {
    this.initClipboard();
  },
  methods: {
    // 初始化复制插件
    initClipboard() {
      const clipboard = new Clipboard(this.$refs.copyBtn);
      clipboard.on('success', () => {
        Notify({ type: 'primary', message: '已将token复制到剪贴板,请在输入框中粘贴后登录' });
      });
    },
  },
};

在methods中定义一个初始化这个插件的方法，然后在mounted()函数即页面挂载时调用即可
粘贴成功后会弹出通知

-EOF-