How to give a mail to link in html reactjs

In ReactJS, you can use the mailto link to create a link that opens the user's default email client with a pre-filled email address and subject. Here's an example:

import React from 'react';

const MailLink = () => {
  const email = '[email protected]';
  const subject = 'Hello from ReactJS!';

  return (
    <a href={`mailto:${email}?subject=${subject}`}>
      Send Email
    </a>
  );
};

export default MailLink;

In this example, we define a MailLink component that takes an email and subject prop. We then use the href attribute to create a mailto link that opens the user's default email client with the pre-filled email address and subject.

When the user clicks the link, their default email client will open with the pre-filled email address and subject. For example, if the user clicks the link, their email client might look like this:

To: [email protected] Subject: Hello from ReactJS!

Note that you can also add additional parameters to the mailto link, such as body for the email body or cc for the carbon copy. For example:

<a href={`mailto:${email}?subject=${subject}&body=Hello+from+ReactJS!`}>
  Send Email
</a>

This would pre-fill the email body with the text "Hello from ReactJS!".

Also, you can use a library like react-mailto which provides a more convenient way to create mailto links in React.

import Mailto from 'react-mailto';

const MailLink = () => {
  const email = '[email protected]';
  const subject = 'Hello from ReactJS!';

  return (
    <Mailto
      email={email}
      subject={subject}
      body="Hello from ReactJS!"
    >
      Send Email
    </Mailto>
  );
};

This library provides a more declarative way to create mailto links, and also supports additional features like handling errors and providing a fallback link.