我的网站是用React编码的。我希望网站是静态的，这样我就可以把它放在Github上，并使用Netlify托管它。
下面的代码是我的电子邮件表单。目前我使用的是php脚本。我想改变这一点，以使我的网站静态。我真的只想知道我必须在action='./php/sendEmail.php'行将操作更改为什么，这样我就不必再使用php，只需访问我的sendinblue帐户(我听说它在一定程度上是免费的，所以这就是我想通过mailgun使用它的原因(，并将电子邮件发送到我的电子邮件地址。
var Field = (props) => {
return (
<input id={props.id} className={props.className} aria-invalid="false" name={props.name} placeholder={props.name} data-aid={props.dataAid} type={props.type} onChange={(e) => dispatch(editValue(e.target.value,item.id)) }></input>
)
}
Field.defaultProps = { type: 'text'}
var EmailForm = (props) => {
return (
<div className="form" data-state="desktop left" data-dcf-columns="4">
<form action='./php/sendEmail.php' method="post" role="form" aria-label="contact form" className="form_style-wrapper" encType="multipart/form-data">
<Field id='field1' name='Name' dataAid='nameField' className='field_word required' />
<Field id='field2' name='Email' dataAid='emailField' className='field_word required' />
<Field id='field3' name='Phone' dataAid='emailField' type='hidden' className='field_word' />
<Field id='field4' name='Subject' dataAid='subjectField' className='field_word' />
<textarea name="Message" className="message" placeholder="Message" data-aid="messageField"></textarea>
<button className="sendButton" type="submit" name="submit" value="Send">Send</button>
</form>
</div>
)
}
EmailForm.defaultProps = {
action: 'handleSubmit'
}
您可以在Sendinblue帐户上配置字段，只需使用它们的RESTAPI即可发送电子邮件。
不过，您需要创建和配置模板。https://developers.sendinblue.com/reference#sendtransacemail
API调用示例：
curl --request POST
--url https://api.sendinblue.com/v3/smtp/email
--header 'accept: application/json'
--header 'api-key:YOUR_API_KEY'
--header 'content-type: application/json'
--data '{
"sender":{
"name":"Sender Alex",
"email":"senderalex@example.com"
},
"to":[
{
"email":"testmail@example.com",
"name":"John Doe"
}
],
"subject":"Hello world",
"htmlContent":"<html><head></head><body><p>Hello,</p>This is my first transactional email sent from Sendinblue.</p></body></html>"
}'编辑：
如果要调用API，首先需要维护表单状态。所以最好是将功能组件转换为有状态组件。
您可以在这里阅读更多关于有状态组件的信息：https://medium.com/@imletaconnoux/stateful-and-stateless-components-in-react-5da5cedb808f
根据您的请求，我举了一个在表单提交上进行api调用(使用axios(的例子。您可以使用引用并将其实现到您的应用程序中。你可以使用fetch-api来代替axios以及
https://codesandbox.io/s/misty-sun-2xpri
正如Saurabh所说，您可以向Sendinblue服务器发出API请求，该服务器将从后端向您发送电子邮件。您可以使用fetch模块直接从表单中发送数据。您需要编写javascript，以便在一个对象中收集表单中的所有字段值，然后将其发送到目标url。