功能实现:
运用原生js实现H5
网页点击复制来分享链接功能
一:进行组件事件,传参pcUrl
<view class="share" @click="handleShare(pcUrl)">
<button class="btns" data-name="shareBtn" open-type="share">
<view class="image-text">
<view class="image">
<image src="../../static/image/share.png" mode=""></image>
</view>
<view class="text">
<text>分享</text>
</view>
</view>
</button>
</view>
二:通过window.location.href来获取当前页面的url
data(){
return{
pcUrl:"",
}
}
created(){
this.pcUrl = window.location.href;
}
三:通过原生js来模拟创建输入框进行复制
handleShare(item) {
console.log("点击分享");
// 创建模拟 输入框
var cInput = document.createElement("input");
cInput.value = item;
document.body.appendChild(cInput);
cInput.select(); // 选取文本框内容
// 执行浏览器复制命令
// 复制命令会将当前选中的内容复制到剪切板中(这里就是创建的input标签)
// Input要在正常的编辑状态下原生复制方法才会生效
document.execCommand("copy");
// 复制成功后再将构造的标签 移除
document.body.removeChild(cInput);
},