学习使用微信小程序实现智能名片电子名片功能代码

最新推荐文章于 2025-09-12 10:15:20 发布

原创最新推荐文章于 2025-09-12 10:15:20 发布 · 2.5k 阅读

20 ·

CC 4.0 BY-SA版权

文章标签：

#学习 #微信小程序 #小程序

微信-小程序专栏收录该内容

48 篇文章

订阅专栏

本文详细介绍了如何在微信小程序中实现智能名片功能，包括拨打手机号、一键复制信息、定位导航、存入手机通讯录和转发分享等实用功能的代码示例。

学习使用微信小程序实现智能名片电子名片功能代码

拨打手机号功能

wx.makePhoneCall({
  phoneNumber: 'qipa250' //仅为示例，并非真实的电话号码
})

一键复制信息功能

wx.getClipboardData({
  success (res){
    console.log(res.data)
  }
})

复制到剪贴板

定位导航功能

wx.getLocation({
 type: 'gcj02', //返回可以用于wx.openLocation的经纬度
 success (res) {
   const latitude = res.latitude
   const longitude = res.longitude
   wx.openLocation({
     latitude,
     longitude,
     scale: 18
   })
 }
})

存入手机通讯录功能

wx.addPhoneContact({
        firstName: ifirstName,
        mobilePhoneNumber: mobilePhoneNumber,
        weChatNumber: weChatNumber,
        organization: organization,
        title: title,
        addressStreet: addressStreet,
        email: email
      });

添加手机通讯录联系人。用户可以选择将该表单以「新增联系人」或「添加到已有联系人」的方式，写入手机系统通讯录。

转发分享功能

页面内发起转发。通过给 button 组件设置属性 open-type=“share”，可以在用户点击按钮后触发 Page.onShareAppMessage 事件，相关组件：button。

 /**
     * 用户点击右上角分享
     */
    onShareAppMessage(res) {
        this.setData({
            is_share: false,
            container_top: 50,
        })
        console.log('res===', res);
        //分享地址 路径，传递参数到指定页面。(为空则为当前页面路径)
        let share_path = '/qipa250/pages/my-card/index?qipa=' + this.data.qipa+ "&tel=" + this.data.phone;
        let share_title = this.data.nickname + '的名片，请惠存';
        if (res.from == 'button') {
            // 来自页面内转发按钮
            return {
                title: share_title,
                path: share_path,
            }
        } else {
            //否则是三个点
            return {
                title: share_title, //分享内容(为空则为当前页面文本)
                path: share_path
            };
        }
    }