web-dev-qa-db-ja.com

React Nativeで電話をかける方法

テキストコンポーネントを押すと、その値を呼び出します。しかし、実際には、そのための十分な知識がありません。

どのライブラリまたはコンポーネントを使用すべきか教えてください。

enter image description hereenter image description here

react-nativephone-call
25
Just Ahead

react-native-phone-callのソースコードを見ると、最終的には単なるラッパーです。

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

このメソッドを使用して、Androidおよびiosの番号を呼び出し、このメソッドをutilsファイルに配置して、好きな場所で使用できます。乾杯

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));
};
13
Aakash Daga

iOSでは非常に簡単です。

import {Linking} from 'react-native'

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

本当の答えではありませんが、コメントするのに十分な担当者がいません。

react-native-phone-call または react-native-communications についてはどうですか？

4
Marco
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>
              )
  }

}
1
ramashish tomar

1。npmを使用してreact-native-phone-callパッケージをインストールします

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

2。makeCall（）というメソッドを作成します

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

。TouchableOpacityのonPressイベントでメソッドを呼び出す

<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)}
>
1
Codemaker

{Linking.openURL（tel:${phonenumber}）;}を使用したonPressアクションを配置するだけです

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

ps：「react-native」からリンクをインポートすることを忘れないでください

0
Sjonchhe