如何打电话在反应本土？

小开

最佳答案

If you look at the source code for react-native-phone-call, it's ultimately just a wrapper for:

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

小开

You can use this method to call numbers in android and ios, place this method in a utils file and use the method wherever you want. cheers

import { Linking, Alert, Platform } from 'react-native';


export const callNumber = phone => {
console.log('callNumber ----> ', phone);
let phoneNumber = phone;
if (Platform.OS !== 'android') {
phoneNumber = `telprompt:${phone}`;
}
else  {
phoneNumber = `tel:${phone}`;
}
Linking.canOpenURL(phoneNumber)
.then(supported => {
if (!supported) {
Alert.alert('Phone number is not available');
} else {
return Linking.openURL(phoneNumber);
}
})
.catch(err => console.log(err));
};

更新(Andrey Patseiko 评论)

别忘了加入 Info.plist->

<key>LSApplicationQueriesSchemes</key>
<array>
<string>tel</string>
<string>telprompt</string>
</array>

小开

it is very simple for ios:

import {Linking} from 'react-native'


<Text onPress={()=>{Linking.openURL('tel:119');}} style={styles.funcNavText}>119</Text>

小开

1. install react-native-phone-call package using npm

$ npm install --save react-native-phone-call

2. 创建一个名为 makCall ()的方法

makeCall = (number) => {
const args = {
number: number, // String value with the number to call
prompt: true // Optional boolean property. Determines if the user should be prompt prior to the call
}
call(args).catch(console.error)
}

3. 调用 onPress 事件中 TouchableOpacity 的方法

<TouchableOpacity key={index} style=\{\{width: '80%', height: 80, backgroundColor: 'rgb(186, 186, 186)',  alignItems:'center', justifyContent: 'space-between', borderBottomWidth: 0.5, borderBottomColor: '#000000'}}
onPress={()=> this.makeCall(item.contactNumber)}
>

小开

只需使用{ Linking.openURL (tel:${phonenumber}) ; }执行 onPress 操作即可

<Text onPress={()=>{Linking.openURL('tel:8777111223');} }>8777111223</Text>

Ps: 不要忘记从“反应原生”导入链接

小开

import React, { Component } from "react";
import {Linking,Platform,TouchableOpacity,Text} from "react-native";
export default class MakeCall extends Component {
 

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

Render(){
return(
<TouchableOpacity
style=\{\{
height: 30,
width: 30,
backgroundColor: "#329df4",
alignItems: "center",
justifyContent: "center",
borderRadius: 5
}}
onPress={()=>{this.dialCall(123456789)}}
>
<Text>Phone</Text>
</TouchableOpacity>
)
}


}

小开

在安卓系统上，react-native-send-intent是伟大的拨号电话号码，而不打开安卓拨号应用程序。

On iOS, use the openUrl method which do (almost) the same.

小开

举个例子:

<ButtonOrange onPress={() => { Linking.openURL(`tel:999990000`) }}>
<ViewCenter>
<Icon name="phone" size={18} color="#fff" />
<ButtonText>Call</ButtonText>
</ViewCenter>
</ButtonOrange>

小开

最简单的方法就是这样

import { Linking } from "react-native";


Linking.openURL(`tel:${phoneNumber}`);

小开

import { View,Linking,Text, Image,Platform,TouchableOpacity } from 'react-native';


const onPressMobileNumberClick = (number) => {


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

Linking.openURL(phoneNumber);
}
  



<TouchableOpacity
onPress={() => { onPressMobileNumberClick("9211886204") }} >
<Text style=\{\{ textDecorationLine: 'underline', textAlign: 'center', }>
{"9211886204"}
</Text>
</TouchableOpacity>

小开

import {useNavigation} from '@react-navigation/native';
import React from 'react';
import {Linking,View, Button} from 'react-native';


export function LegalScreen() {
const navigation = useNavigation();


return (
<View style=\{\{flex: 1, alignItems: 'center', justifyContent: 'center'}}>
<Button
onPress={() => {Linking.openURL('tel:9873');}}
title="Call Helpline"
/>
</View>
);
}

只需导入本地反应链接，然后在 onPress 函数中添加这个{ Linking.openURL (‘ tel: 9873’) ; }。你可以用任何你想要的数字来替换9873。