微信小程序-长按复制、一键复制功能

先来说明一下我们需要实现的最终效果：

用户点击之后复制页面内容。参考详情

一、长按复制：

长按复制，在微信小程序内的文字无法长按复制，除了text节点以外，但是要在text标签内加一个“selectable”属性。

话不多说，我们直接上代码

1.WXML

< text selectable="true" >长按复制< text/> 

---

二、一键复制：

添加点击事件，绑定js方法，点击复制。

话不多说，我们直接上代码

1.WXML

<view bindtap="copy" data-item='{{text}}'>点击复制内容：{{text}}</view>

---

2.JS

Page({
  data: {
   text:"123456789",
  },

    copy: function (e) {
        let item = e.currentTarget.dataset.item;
        console.log("复制", e, item);
        wx.setClipboardData({
        data: item,
        success: function (res) {
            showToastInfo({
                title: '复制成功',
                icon:"success"
            });
        }
    });
    },
})

------------- The End -------------

许可协议: 转载请保留原文链接及作者。