30 seconds of React

  Back to Home

Mailto

visualbeginner

Renders a link formatted to send an email.

  • Destructure the component's props, use email, subject and body to create a <a> element with an appropriate href attribute.
  • Render the link with props.children as its content.
function Mailto({ email, subject, body, ...props }) {
  return (
    <a href={`mailto:${email}?subject=${encodeURIComponent(subject) || ''}&body=${encodeURIComponent(body) || ''}`}>{props.children}</a>
  );
}