如何从同一按钮Vuejs直接创建复制按钮

<script src="https://cdn.jsdelivr.net/npm/clipboard@2.0.8/dist/clipboard.min.js"></script>

<template>
  <div>
    <button v-on:click="copyText">复制</button>
  </div>
</template>

<script>
  export default {
    methods: {
      copyText() {
        const textToCopy = "要复制的文本内容";
        const clipboard = new ClipboardJS('.copy-button', {
          text: () => textToCopy
        });

        clipboard.on('success', (e) => {
          console.log('复制成功');
          clipboard.destroy();
        });

        clipboard.on('error', (e) => {
          console.log('复制失败');
          clipboard.destroy();
        });

        // 触发点击事件，模拟用户点击复制按钮
        clipboard.onClick({ target: document.querySelector('.copy-button') });
      }
    }
  }
</script>