How to launch and open email client ReactJS

Viewed 14837

I want to show a pop-up like this click here in my react application. In simple words, I want to launch and open the email client in ReactJs. I am currently using a simple p tag:

 <p className="cnct_email_addr">Email US</p>

I know there is a way to use mailto like this:

<a href="mailto:someone@yoursite.com">Email Us</a>

But I want to know if there is a more reactish-way of doing it. If there is one please let me know.

3 Answers

You can open the mailto link using window

window.open('mailto:email@example.com?subject=Subject&body=Body%20goes%20here')
const Mailto = ({ email, subject, body, children }) => {
  return (
    <a href={`mailto:${email}?subject=${encodeURIComponent(subject) || ''}&body=${encodeURIComponent(body) || ''}`}>{children}</a>
  );
};

ReactDOM.render(
  <Mailto email="foo@bar.baz" subject="Hello & Welcome" body="Hello world!">
    Mail me!
  </Mailto>,
  document.getElementById('root')
);

Reference link.

You must import this 'Linking'

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