【React Native】如何拨打电话?

surile
2021-04-28 / 0 评论 / 46 阅读 / 正在检测是否收录...
温馨提示:
本文最后更新于2021年04月28日,已超过223天没有更新,若内容或图片失效,请留言反馈。

前言

每次都知道使用React Native提供的Linking来进行调用,但是过很长时间就忘记了。记得不太熟悉,所以就有此文章了。

场景

点击按钮调用原生(android/ios)拨号界面,并填充号码。

添加权限

ios版本在9.0之后,都需要在Info.plist里添加一个叫LSApplicationQueriesSchemesArray,将tel添加进去,否则在模拟器上会出现警告,若是使用canOpenURL来判断是否的话,捕获的错误也是让你添加。

ko18l6uh.png

安卓不需要添加任何权限,即可调用。

实现


    const tel = `tel:${item.mobile}`
    Linking.canOpenURL(tel)
      .then(supported => {
        if (!supported) {
          console.log('Can not handle tel:', tel)
        } else {
          return Linking.openURL(tel)
        }
      })
      .catch(err => {
        console.log('tel error:', err)
      })

注:ios模拟器上,会弹出一个warning,这是因为ios模拟器不支持打电话。因此在代码中添加了supported字段,判断是否可以处理,避免弹出warning。

其他功能

  • 对于web链接来说,协议头("http://", "https://")不能省略!
  • 可调用系统的其他应用,调用方式依然是判断是否安装应用,或者是否打开该url,再通过Linking.openURL启动。比如电话、短信、邮件。
  • 基本上都可以使用以上实现方式
3

评论 (0)

取消