我正在使用React 16和'mailgun.js“:” ^ 2.0.1“,这是我的新手。我有一个简单的表单,想用mailgun发送出去。我拥有mailgun的所有凭据但是我不知道如何将我的react组件与mailgun相连,以便将其邮寄到指定的电子邮件地址。这是我的代码,如果可以的话,我会很感激。
import React from 'react';
import mailgun from 'mailgun.js';
const mg = mailgun.client({
username: 'api',
key: process.env.MAILGUN_API_KEY || '',
public_key: process.env.MAILGUN_PUBLIC_KEY || 'pubkey-yourkeyhere'
});
class Form extends React.Component {
constructor(props) {
super(props)
this.state = {
firstName: '',
lastName: '',
email: '',
phone: '',
message: '',
}
}
onChangeHandler = e => {
this.setState({
[e.target.name]: e.target.value
});
};
onSubmit(e) {
e.preventDefault();
console.log(this.state);
}
render() {
const { firstName, lastName, email, phone, message } = this.state;
return (
<form className={styles}>
<div className="Group_wrapper">
<input
name="fistName"
placeholder="First Name"
value={firstName}
onChange={e => this.onChangeHandler(e)}
/>
<input
name="lastName"
placeholder="Last Name"
value={lastName}
onChange={e => this.onChangeHandler(e)}
/>
</div>
<div className="Group_wrapper">
<input
name="email"
placeholder="Email"
value={email}
onChange={e => this.onChangeHandler(e)}
/>
<input
name="phone"
placeholder="Phone"
value={phone}
onChange={e => this.onChangeHandler(e)}
/>
</div>
<textarea
name="message"
placeholder="Message"
value={message}
onChange={e => this.onChangeHandler(e)}
/>
<button onClick={(e) => this.onSubmit(e)} className="Btn_ivent">Send</button>
</form>
);
}
}
export default Form;