React Native 使用文本输入向 whatsapp 发送消息

Question

我正在尝试通过文本输入向 whatsapp 发送消息，

我想做的是输入手机号码 -> 完整输入消息 -> 使用 Linking.openURL

发送消息

但是问题出在我尝试输入消息时，当我还没有完成输入时，它会将我引导至 WhatsApp。我给你图片

如您所见，只有 1 个字母（问题所在）

这是我的功能

sendOnWhatsApp = () => {
          console.log('test')
          let msg = this.state.msg;
          let mobile= this.state.mobile_no;

          if (mobile) {
               if (msg) {
                    let url = 'whatsapp://send?phone=62' + this.state.mobile_no + '&text=' + this.state.msg;
                    Linking.openURL(url).then(() => {
                         console.log('WhatasApp Opened');
                    }).catch(() => {
                         alert('Make Sure whatsapp is installed on your device');
                    });
               }else{
                    console.log('Please insert message to send');
               }
          }else{
               console.log('Please insert mobile no');
          }
     }

这是我的文本输入

render() {
          return (
               <View style={styles.container}>
                    <Text style={{textAlign: 'center', fontSize: 20, paddingVertical: 30}}>
                          Send Your Message to Whatsapp
                    </Text>

                    <TextInput 
                         value={this.state.mobile_no}
                         onChangeText={mobile_no => this.setState({mobile_no})}
                         placeholder={'87877900297'}
                         style={styles.input}
                         keyboardType={'numeric'}
                    />
                    <TextInput 
                         value={this.state.msg}
                         onChangeText={msg => this.setState({msg})}
                         placeholder={'Enter Your Message'}
                         style={styles.input}
                    />

                    <View style={{marginTop: 20}}>
                         <Button 
                              onPress={this.sendOnWhatsApp()}
                              title={'Send Message'}
                         />
                    </View>
               </View>
          )
     }

我怎样才能解决这个问题以完全键入然后使用按钮发送消息？

提前致谢！

Answer 1

您是在将函数传递给 onPress 属性时调用函数。您只需要传递函数引用即可。

    onPress={this.sendOnWhatsApp}

React Native 使用文本输入向 whatsapp 发送消息

React Native send message to whatsapp with text Input

javascript

whatsapp

react-native