uniapp如何实现拨打电话功能

在uniapp中如何实现拨打电话功能？我想在应用中添加一个按钮，点击后直接调用系统拨号界面并填入指定电话号码。请问应该使用哪个API？是否需要配置特殊权限？在iOS和Android平台上实现方式是否有差异？求具体代码示例和注意事项。

2 回复

在uniapp中，可以使用uni.makePhoneCall方法实现拨打电话。例如：

uni.makePhoneCall({
  phoneNumber: '10086'
})

调用后会弹出系统拨号界面，用户确认后即可拨打电话。


在 UniApp 中，可以通过 uni.makePhoneCall() API 实现拨打电话功能。这个接口会调用设备的系统拨号界面，用户确认后即可拨打电话。

代码示例

// 在方法中调用
makePhoneCall() {
  uni.makePhoneCall({
    phoneNumber: '13800138000', // 替换为需要拨打的电话号码
    success: () => {
      console.log('成功调起拨号界面')
    },
    fail: (err) => {
      console.log('拨号失败:', err)
    }
  })
}

注意事项

  1. 权限问题：在 Android 平台需要申请 CALL_PHONE 权限，但 UniApp 已自动处理。如果遇到无法拨号，请检查设备权限设置。
  2. 号码格式：确保 phoneNumber 为字符串格式，且仅包含数字和可选符号（如 + 用于国际号码）。
  3. 用户体验：建议在调用前添加确认提示，避免误触。

完整页面示例

<template>
  <view>
    <button @click="callCustomerService">拨打客服电话</button>
  </view>
</template>

<script>
export default {
  methods: {
    callCustomerService() {
      uni.showModal({
        title: '提示',
        content: '确定要拨打客服电话吗？',
        success: (res) => {
          if (res.confirm) {
            uni.makePhoneCall({
              phoneNumber: '400-123-4567'
            })
          }
        }
      })
    }
  }
}
</script>

平台差异

  • 各平台均支持，但界面样式由系统决定。
  • 部分模拟器可能无法测试，建议使用真机调试。

通过以上方法即可在 UniApp 中快速实现拨打电话功能。

回到顶部