反应原生的电话

Posted 2023-04-18

【中文标题】反应原生的电话

【英文标题】：Phone call in react native

【发布时间】：2021-10-13 00:26:31

【问题描述】：

我想用 React Native 打电话，我是 React Native 的初学者，所以我遇到了这个看起来像我的问题 => How to make phone call in React Native?

所以，这是我的代码的一部分，但它不起作用，当我点击图标时，什么都没有发生，我的终端上也没有错误，这很奇怪。这是我的代码：

import React from 'react';
import  Image, Text, View, StyleSheet  from 'react-native';

import  Avatar  from "react-native-elements";
import  Linking  from 'react-native';

export const makeCall = () => 

    let phoneNumber = '';

    if (Platform.OS === 'android') 
        phoneNumber = 'tel:$0123456789';
     else 
        phoneNumber = 'telprompt:$0123456789';
    

    Linking.openURL(phoneNumber);
;

const Contacts = () => 

  return (
    <View style=styles.column>
       <Avatar
         size=65
         rounded
         overlayContainerStyle= backgroundColor: '#fff' 
         icon= name: 'phone', color: '#113D78', type: 'font-awesome' 
         onPress=() => makeCall
         style=
           width: 65,
           height: 65,
           borderRadius: 50,
           borderWidth: 2,
           borderColor: '#113D78',
         
     />
     <Text style=styles.subtitle>Phone</Text>
   </View>
);

导出默认联系人；

【参考方案1】：

如果你有一个 phoneNumber 变量，看起来你没有为你的 phoneNumber 字符串使用反引号。现在您正在对数字进行硬编码，因此只需使用 tel:[phone] 而不使用大括号和美元符号。此外，如果您使用更新的 react-native 版本，tel:$number 应该在两个平台上都可以使用。 并且请记住，ios 模拟器不支持打开通话，因此您必须在真机或 Android 上进行测试。

【讨论】：

感谢您的回复，我加了反引号并在手机上进行了测试，效果很好，但我使用的是电话：[phone]！我认为它也适用于模拟器

【参考方案2】：

你的问题在这里。在这个函数中

export const makeCall = () => 

    let phoneNumber = '';

    if (Platform.OS === 'android') 
        phoneNumber = 'tel:$0123456789';   // Error in this line
     else 
        phoneNumber = 'telprompt:$0123456789';
    

    Linking.openURL(phoneNumber);
;

应该是这样的

export const makeCall = () => 

    let phoneNumber = '';

    if (Platform.OS === 'android') 
        phoneNumber = `tel:$0123456789`;
     else 
        phoneNumber = `telprompt:$0123456789`;
    

    Linking.openURL(phoneNumber);
;

【参考方案3】：

当您将phoneNumber 替换为您要拨打的号码时，这行代码应该适用于两个平台。

import Linking from 'react-native'
Linking.openURL(`tel:$phoneNumber`)