Aplikasi Mobile dengan React-Native Mengirim WA ke Nomor Tidak Dalam Kontak

app.js

import React, {Component} from 'react';
import {Platform, StyleSheet, Text,TextInput, View, Button, Linking} from 'react-native';

type Props = {};
export default class App extends Component<Props> {
  constructor(props) {
    super(props);
    this.state = {
        noHP: ''
    };
  }
  render() {
    return (
      <View style={styles.conMain}>
            <View style={styles.conHeader}>
              <Text style={styles.textHeader}>Kirim WA ke Nomor Asing</Text>
            </View>

        <View style={styles.conCont}>
                <Text style={styles.textInst}>Masukkan No HP </Text>
                <TextInput style={styles.input}
                  keyboardType = 'numeric'
                  onChangeText={(noHP)=>this.setState({noHP})}
                />

              <View style={styles.contButton}>
                  <Button

                  onPress={() => {
                      var phone = this.state.noHP
                      if (phone===''){

                      } else {
                          if (phone.charAt(0)==='0') {
                            phone = '62'+phone.substr(1)

                          } else if (phone.charAt(0)==='+') {
                            phone = phone.substr(1)
                          }
                          var txtlink = 'whatsapp://send?phone=' + phone
                          Linking.openURL(txtlink)
                        }
                    }
                   }
                    title="Kirim Whatsapp"
                    accessibilityLabel="Klik Kirim WA"
                  />
            </View>
        </View>
            <View style={styles.containerFooter}>
               <Text style={styles.textHeader}> http://www.rey1024.com </Text>
            </View>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  conMain : {
    flex:1
  },
  conHeader : {
    flex:1,
    backgroundColor: '#6200EE',
    alignItems: 'center',
    justifyContent: 'center'
  },
  textHeader : {
    fontSize: 20,
    color :'white'
  },
  conCont : {
    flex:8,
    justifyContent: 'flex-start',
    alignItems: 'center'
  },
  textInst: {
    marginTop: 30,
    marginBottom: 10,
    fontSize: 20,
    color: '#777',
  },
inputContainer: {
  borderLeftWidth: 1,
  borderRightWidth: 1,
  height: 30
},
input: {
  height: 50,
  width: "90%",
  backgroundColor: '#ffffff',
  paddingLeft: 15,
  paddingRight: 15,
  fontSize: 14,
  marginBottom: 30
},
button: {
  fontSize: 14,
  alignItems: 'center'
},
containerFooter: {
    flex: 1,
    backgroundColor: '#140033',
    alignItems: 'center',
    justifyContent: 'center'
},
contButton : {
    width: "90%",
}

});