LLEARNING NOTES

技术 · 思考 · 实践 · 成长

首页/微信小程序/正文

微信小程序 复制/拨打/保存电话

微信小程序253 次阅读


一、WXML

 <view class="action-btn copy" bindtap="copyPhone" data-phone="{{user.mobile}}" data-name="{{user.name}}">
            <text class="icon">复制</text>
          </view>
          <view class="action-btn call" bindtap="callPhone" data-phone="{{user.mobile}}">
            <text class="icon">拨打</text>
          </view>
          <view class="action-btn save" bindtap="savePhone" data-name="{{user.name}}" data-phone="{{user.mobile}}">
            <text class="icon">保存</text>
          </view>

二、JS

// 拨打电话
  callPhone(e) {
    const phone = e.currentTarget.dataset.phone;
    wx.makePhoneCall({ phoneNumber: phone });
  },
  // 复制姓名/手机号
  copyPhone(e) {
    const name = e.currentTarget.dataset.name;
    const phone = e.currentTarget.dataset.phone;
    // 拼接复制内容:姓名 手机号
    const copyText = `${name} ${phone}`;
    wx.setClipboardData({
      data: copyText,
      success() {
        wx.showToast({
          title: '复制成功',
          icon: 'success'
        });
      }
    });
  },
  // 保存通讯录
  savePhone(e) {
    const name = e.currentTarget.dataset.name;
    const phone = e.currentTarget.dataset.phone;
    wx.addPhoneContact({
      firstName: name,
      mobilePhoneNumber: phone,
      success() {
        wx.showToast({ title: '保存成功', icon: 'success' });
      },
      fail() {
        wx.showToast({ title: '保存失败', icon: 'none' });
      }
    });
  }


顺,不妄喜;逆,不惶馁;安,不奢逸;危,不惊惧。--史记

评论交流

理性讨论,共同进步
验证码

相关文章

继续阅读