我正在使用react.js制作一个表单,并希望将表单字段数据发送到电子邮件。我尝试了此操作(action=”mailto:example@gmail.com“),但没有任何React。我尝试操作mailto但什么也没发生.我想看到所有字段数据在我的邮件上
kmbjn2e31#
一种方法是手动追加所有表单数据属性,然后像这样打开电子邮件应用程序
window.open("mailto:example@gmail.com?subject=Example Subject&body=all attributes here")
您可以使用反勾号而不是双引号来轻松添加属性,例如
`name: ${data.name}`
eufgjt7s2#
使用emailjs简单方法:1.首次签约1.然后添加服务(保留服务id)1.创建电子邮件模板(保留模板id)1.转到帐户并保留公钥1.转到您的代码:1.创建一个电子邮件表单组件,下面是一个示例:
import { useRef } from "react"; import emailjs from "@emailjs/browser"; const MailForm = () => { const form = useRef(); const sendData = (e) => { e.preventDefault(); emailjs .sendForm( "service_id", "template_id", form.current, "public key " ) .then( (result) => { console.log(result.text); }, (error) => { console.log(error.text); } ); }; return ( <form ref={form} onSubmit={(e) => sendData(e)}> FirstName: <input type="text" name="FirstName" /> Email: <input type="text" name="Email" /> <input type="submit" name="submit" value="Submit" /> </form> ); }; export default MailForm;
1.在emailjs中sendDate函数内插入服务ID、模板ID和公钥注意:最好先将表单发送到后端服务器,然后再从服务器发送电子邮件
2条答案
按热度按时间kmbjn2e31#
一种方法是手动追加所有表单数据属性,然后像这样打开电子邮件应用程序
您可以使用反勾号而不是双引号来轻松添加属性,例如
eufgjt7s2#
使用emailjs简单方法:
1.首次签约
1.然后添加服务(保留服务id)
1.创建电子邮件模板(保留模板id)
1.转到帐户并保留公钥
1.转到您的代码:
1.创建一个电子邮件表单组件,下面是一个示例:
1.在emailjs中sendDate函数内插入服务ID、模板ID和公钥
注意:最好先将表单发送到后端服务器,然后再从服务器发送电子邮件