美文网首页
微信小程序长按复制和按钮复制

微信小程序长按复制和按钮复制

作者: 前端浅语 | 来源:发表于2020-01-20 15:16 被阅读0次
    1. 长按文字复制

    当要实现长按文字进行复制的时候,需要使用text标签,并将selectable属性设置为true

    <text class='url-txt' selectable='true'>长按我复制</text>
    
    2. 按钮复制

    可使用按钮进行快捷复制,使用 \color{#ea4335}{wx.setClipboardData} API

    <!--.wxml文件
    <text class='url-txt' selectable='true'>{{url}}</text>
    <button bindtap='onClick'>复制</button>
    
    <!-- .js文件-->
    onClick: function (e) {
        var that = this;
        wx.setClipboardData({
          //准备复制的数据
          data: that.data.url,
          success: function (res) {
            wx.showToast({
              title: '复制成功',
            });
          }
        });
      }
    

    相关文章

      网友评论

          本文标题:微信小程序长按复制和按钮复制

          本文链接:https://www.haomeiwen.com/subject/mzpjzctx.html