我正在建立我的投资组合(vue + bootstrap),并希望在View.Contact中集成一个非常基本的联系表,Vuelidate的工作正常。 我遇到了emailJS,想以一种动态的方式实现它。
在下一个代码中不会抛出任何错误消息:
**import** emailjs from 'emailjs-com'
**onSubmit()** {
if (this.$validations === true){
window.emailjs.sendForm('gmail', 'portfolio_template', this.form.from_email, this.form.from_name, this.form.message).then((result) =>
{
console.log('SENT FORM', result.status, result.text);
}, (error) => {
console.log('SENDING FORM FAILED', error);
});
}
}
模板的标签:
<b-form @submit.prevent="onSubmit" @reset="onReset" v-if="show" method="post">
<h1>Contact me</h1>
<b-form-group id="input-group-1"
label="Name:"
label-for="input-1"
description="You can enter a company name."
>
<b-form-input
id="input-1"
v-model="form.from_name"
required
></b-form-input>
</b-form-group>
<b-form-group
id="input-group-2"
label="Email:"
label-for="input-2"
>
<b-form-input
id="input-2"
v-model="form.from_email"
required
></b-form-input>
</b-form-group>
<b-form-group
id="input-group-3"
label="Reason for cantact?"
label-for="input-3"
>
<b-form-textarea
id="input-3"
v-model="form.message"
rows="3"
max-rows="6"
required>
</b-form-textarea>
</b-form-group>
<div class="buttons">
<b-button type="submit" pill variant="primary" class="btn-submit" value="Send">Submit</b-button>
<b-button type="reset" pill variant="success" class="btn-reset">Reset</b-button>
</div>
</b-form>
onReset()清除表单。