如何启动和打开电子邮件客户端React-native？

Question

我不想撰写电子邮件。我只是希望能够从反应原生的应用程序在用户的设备（iOS和Android）上启动主电子邮件应用程序。

场景：我会在注册后向用户发送验证电子邮件。

Answer 1

React Native Open Mail Function

<Button onPress={() => Linking.openURL('mailto:support@example.com') }
      title="support@example.com" />

使用主题和正文实现本机打开邮件功能

<Button onPress={() => Linking.openURL('mailto:support@example.com?subject=SendMail&body=Description') }
      title="support@example.com" />

React Native Open URL

<Button onPress={() => Linking.openURL('https://www.google.co.in/') }
      title="www.google.co.in" />

别忘了导入

import { Linking } from 'react-native'

Answer 2

您可以使用react natives链接模块来实现此目的。以下是模块https://facebook.github.io/react-native/docs/linking.html的链接。

示例：Linking.openURL('mailto:example@gmail.com?subject=example&body=example')

Answer 3

不幸的是，所有答案都没有正确。

  

我不想撰写电子邮件。我只希望能够启动主电子邮件应用程序

我希望有相同的行为：

1. 带有按钮Open Email App的登录屏幕
2. 用户打开他的电子邮件应用程序
3. 他可以单击魔术链接以返回应用程序

与带有魔术链接的Slack Onboarding大致相同。

我用库react-native-email-link找到了一个解决方案。 您可以从React Native打开电子邮件客户端（用于“魔术链接”类型功能）。

• 在Android上工作。
• 如果您想在iOS上尝试，则需要拥有一台真实的设备，因为iOS模拟器上没有mail.app。

Answer 4

要在iOS上打开电子邮件应用：

 Linking.canOpenURL('message:')
    .then(supported => {
        if (!supported) {
          console.log('Cant handle url')
        } else {
          return Linking.openURL('message:')
        }
      })
      .catch(err => {
        console.error('An error occurred', err)
      })

Answer 5

reverse_2d_arr(3, arr);

Answer 6

我认为以下npm模块应该包含您正在寻找的内容。不幸的是，它使用本机库，因此您必须运行一些反应原生链接。

https://www.npmjs.com/package/react-native-mail

Answer 7

<TouchableOpacity onPress={()=>{ 
  Linking.openURL('mailto:support@domain.com?subject=mailsubject&body=mailbody');
                            }}>
    <View><Text>Contact Us</Text></View>
 </TouchableOpacity>

这项工作适合我。！

Answer 8

您可以使用此方法打开任何电子邮件客户端并发送包含一些数据的电子邮件。

export const sendEmailViaEmailApp = (toMailId, subject, body) => {
  if (!isUndefined(toMailId)) {
    let link = `mailto:${toMailId}`;
  if (!isUndefined(subject)) {
    link = `${link}?subject=${subject}`;
  }
 if (isUndefined(subject)) {
   link = `${link}?body=${body}`;
 } else {
   link = `${link}&body=${body}`;
 }

Linking.canOpenURL(link)
  .then(supported => {
    if (supported) {
      // 'mailto:support@example.com?subject=Billing Query&body=Description'
      Linking.openURL(link);
    }
  })
  .catch(err => console.error('An error occurred', err));
} else {
  console.log('sendEmailViaEmailApp -----> ', 'mail link is undefined');
 }
};

将此方法放在utils类中，并在需要的地方使用此方法

Answer 9

将react-native-mail用于启动电子邮件客户端。它将自动打开电子邮件客户端。 https://www.npmjs.com/package/react-native-mail

Answer 10

Expo.io纯js / typescript解决方案：

import * as IntentLauncher from 'expo-intent-launcher';

// ...

  public openMailClientIOS() {
    Linking.canOpenURL('message:0')
      .then(supported => {
        if (!supported) {
          console.log('Cant handle url')
        } else {
          return Linking.openURL('message:0')
            .catch(this.handleOpenMailClientErrors)
        }
      })
      .catch(this.handleOpenMailClientErrors)
  }

  public openMailClientAndroid() {

    const activityAction = 'android.intent.action.MAIN'; // Intent.ACTION_MAIN
    const intentParams: IntentLauncher.IntentLauncherParams = {
      flags: 268435456, // Intent.FLAG_ACTIVITY_NEW_TASK
      category: 'android.intent.category.APP_EMAIL' // Intent.CATEGORY_APP_EMAIL
    };

    IntentLauncher.startActivityAsync(activityAction, intentParams)
      .catch(this.handleOpenMailClientErrors);
  }

在带有Mail的iOS中工作，在Android上工作

Android Intent文档：https://developer.android.com/reference/android/content/Intent#ACTION_MAIN

Expo IntentLauncher文档：https://docs.expo.io/versions/latest/sdk/intent-launcher/

Answer 11

对于开放式邮件应用，我已经使用过，并且对我有用

const subject = "Mail Subject"
const message = "Message Body"
Linking.openURL(`mailto:support@domain.com?subject=${subject}&body=${message}`)

Answer 12

如果您想要一个适用于Android和iOS的包装器。 https://www.npmjs.com/package/react-native-email-action

iOS与其他电子邮件应用程序兼容。