美文网首页
vue通过v-clipboard实现一键复制功能

vue通过v-clipboard实现一键复制功能

作者: 郭先森啊 | 来源:发表于2021-08-11 15:00 被阅读0次
关注公众号【Miles】查看更多技术文档
 <el-button
    type="text"
    v-clipboard:copy="copyContent"
    v-clipboard:success="handleCopy"
    v-clipboard:error="handleError"
  >点击复制</el-button>
  
  let copyContent = "我是被复制的内容";
  
  handleCopy() {
    this.$messagesouth({
      message: "复制成功",
      type: "comm",
      center: true
    });
  }
  handleError() {
    this.$messagesouth({
      message: "复制失败",
      type: "comm",
      center: true
    });
  }

效果如下图所示:


image.png
点击复制,复制成功之后,carl+V粘贴即可。

来源:https://juejin.cn/post/6923092170572791822

相关文章

网友评论

      本文标题:vue通过v-clipboard实现一键复制功能

      本文链接:https://www.haomeiwen.com/subject/nelcbltx.html