vue实现点击复制

3. 使用vue-clipboard2库

安装 npm install --save vue-clipboard2
main.js 中引入

<template>
  <div>
    <el-button
      type="primary"
      v-clipboard:copy="message2"
      v-clipboard:success="onCopy"
      v-clipboard:error="onError"
      >复制方法三</el-button
    >
    <div style="margin-top: 50px">{{ message2 }}</div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      message2: "举头望明月",
    };
  },
  methods: {
    // 方法三
    // 使用vue-clipboard2库
    // 安装 npm install --save vue-clipboard2
    // 在main.js中引入
    // import VueClipboard from 'vue-clipboard2';
    // Vue.use(VueClipboard);
    onError() {
      console.error("复制失败");
    },
    // 复制
    onCopy() {
      this.$message.success("复制成功");
    },
  },
};
</script>
————————————————
版权声明：本文为CSDN博主「你的眼睛會笑」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/weixin_45563734/article/details/134920579