vue 和clipboard 得结合

最近工作中遇到了个分享得按钮

点击之后提示分享复制完成，然后自动生成文字

嘿，小伙伴，我在这里发现了一个非常有意思的课程，你也快点加入吧!http://localhost:8080/kcjs?cour=25

嘿嘿，这里写一下我得完成方法。
首先把这个玩意npm下来：

npm install clipboard --save

然后在自己所要用到得组件引用一下子：

import Clipboard from "clipboard";

然后就是用了

{{ phone }}分享

data里面记得定义

重要的一步记得在mounted中初始化一下

mounted() {let _this = this;const clipboard = new Clipboard(".copy-link");clipboard.on("success", function(e) {_this.$message({type: "success",message: "复制成功"});clipboard.off("error");clipboard.off("success");clipboard.destroy();e.clearSelection();});clipboard.on("error", function(e) {_this.$message({type: "warning",message: "对不起，复制失败了，请手动复制吧"});clipboard.off("error");clipboard.off("success");clipboard.destroy();});},

完成！

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！