小程序中点击按钮实现复制功能

1.微信小程序中点击实现复制功能

1.1js

textPaste(){
    wx.showToast({
      title: '复制成功',
    })
    wx.setClipboardData({
      data: '点击复制的内容',
      success: function (res) {
        wx.getClipboardData({    //这个api是把拿到的数据放到电脑系统中的
          success: function (res) {
            console.log(res.data) // data
          }
        })
      }
    })
  },

1.2wxml

<text class='shopName' bindtap='textPaste'>{{shopDetailList.shopName}}</text>

.shopName{
  position:absolute;
  left:0;
  top:0;
  z-index:-1000;
  opacity:0;
  color:transparent;
  background:transparent;
}

1.4说明

①在微信小程序中提供了api（wx.getClipboardData）可以直接调用

参考官网：https://developers.weixin.qq.com/miniprogram/dev/api/wx.getClipboardData.html?search-key=wx.getClipboardData

②在其它端(例如pc和触屏等通过js来实现控制的)，需在页面用一个input框，但小程序可以通过 that.data.textPaste 来获取；

2.对于 text 标签还可以通过设置  selectable="true"  来实现开放长按复制工能；

3.转载地址：

https://www.cnblogs.com/xuhuang/p/9720337.html