【发布时间】:2015-08-19 13:35:16
【问题描述】:
我正在使用 VueJS 和 jQuery 作为前端,Laravel 5 作为后端构建一个群发邮件系统。
我正在使用 AJAX 调用来检索基于组、机构或所有活动用户的用户列表。然后,用户可以根据 DOM 中的这些结果删除地址(VueJS data)并手动添加新地址。
表单包含一个文件,因此我不能(或不希望,基于兼容性问题)使用 AJAX 调用发送表单数据。问题是我需要在用户提交表单时将电子邮件地址列表连同表单一起发送。
这里是 Javascript。最相关的部分是 serializeRecipients 方法,我将每个电子邮件地址附加到隐藏的表单字段:
var vm = new Vue({
el: '#emailContainer',
data: {
recipients: [
{
name: "Joe Smith",
email: "joe@demo.com"
}
],
individualRecipients: [],
manualRecipient: null,
validation: {
email: true
}
},
methods: {
//
serializeRecipients: function() {
var recipientAddresses = [];
var individualRecipientAddresses = [];
$.each(this.recipients, function (k, recipient) {
recipientAddresses.push(recipient['email']);
});
$.each(this.individualRecipients, function(k, recipient) {
individualRecipientAddresses.push(recipient);
});
$("#recipientsInput").val(recipientAddresses);
$("#individualRecipientsInput").val(individualRecipientAddresses);
}
}
});
在表单元素上我使用v-on="submit: serializeRecipients"。这会生成以下表单输出:someone@demo.com, someoneelse@demo.com,然后我使用 PHP 的 explode() 函数将其转换为数组。
这一切都有效,但我想知道是否有更好的方法来实现这一点。任何建议将不胜感激!
【问题讨论】:
标签: javascript jquery vue.js