微信小程序-复制到剪切板

最新推荐文章于 2022-10-14 10:28:31 发布

原创

最新推荐文章于 2022-10-14 10:28:31 发布 · 3.8k 阅读

3 ·

CC 4.0 BY-SA版权

文章标签：

#复制

本文介绍了如何在微信小程序中实现复制内容到剪切板的功能，包括.wxml和.js的具体实现步骤，以及wx.setClipboardData和wx.getClipboardData两个API的详细说明。

一、效果

二、实现

1）.wxml:

<text>被复制的内容：{
  
  {text}}</text>
<view bindtap='copyText' class="copyButton">复制按钮</view>
<text>显示复制内容：{
  
  {text2}}</text>

2）.js:

  data: {
    text:"我是钢铁侠我是钢铁侠"
  },
  copyText:function(){
    let that=this
    //获取剪切板内容
    wx.getClipboardData({
      success(res) {
        wx.setClipboardData({
          data:that.data.text ,
          success(res) {
            //粘贴到对应的位置
            wx.getClipboardData({
              success(res) {
                that.setData({
                  text2:res.data
                })
              }
            })
          }
        })
      }
    })
  },