电话呼叫处于本地反应状态

Question

我想用React Native打电话，我是React Native的初学者，所以我遇到了这个问题，看起来像我的问题=>如何在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>
);

}

导出默认联系人；

Answer 1

如果您有phoneNumber变量，则看起来您没有使用phoneNumber字符串的backticks。现在你正在对数字进行硬编码，所以只需使用不带花括号和美元符号的tel:[phone]。此外，如果你使用较新的react本机版本，tel:${number}应该可以在这两个平台上工作。请记住，iOS模拟器不支持打开通话，因此您必须在真实设备或android上进行测试。

Answer 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);
};

Answer 3

当您用要调用的号码替换phoneNumber时，这行代码应该在两个平台上都能工作。

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

Answer 4

您在代码中使用的Template Literal，但它的方式不对。您使用了'...'单引号而不是backtick (``)。

在ECMAScript 2015规范的早期版本中，它们被称为template strings。

Chrome 41、Firefox 34、Edge 12及以上支持Template literals，但Internet Explorer不支持。

你可以从这里了解更多关于这方面的信息。

但是，我在应用程序中使用了您的代码，并签入了emulator。它现在有效。

您只能将string与单引号'...'一起使用，也可以不使用&{...}，如下所示：

let phoneNumber = '';
if (Platform.OS === 'android') {
phoneNumber = 'tel:[phone]';
} else {
phoneNumber = 'telprompt:0123456789';
}
Linking.openURL(phoneNumber);

或者，如果您使用${...}，则必须使用backtick (``)，因为这意味着您在template string中使用variable或number，如下所示：

let phoneNumber = ``;
if (Platform.OS === 'android') {
phoneNumber = `tel:${0123456789}`;
} else {
phoneNumber = `telprompt:${0123456789}`;
}
Linking.openURL(phoneNumber);

希望你也能理解这个用例。