我对vuex和vue-js非常陌生。我正在尝试使用vuex发布表单数据。到目前为止,我成功地通过了标题,但是我不知道如何传递多个数据?
要传递的数据:
// Title
<input type="text" name="subject_title">`
// selected data
<datepicker id="set_date" name="set_date"></datepicker>
// array of options
<multiselect v-model="value" :max-height="0" :options="options" :searchable="false" :multiple="true" group-label="language" track-by="name" label="name" placeholder=""><span class="arrow" slot="caret"></span></multiselect>
我已经在github上放置了一些代码:https://github.com/samB67/VuexPost
您可以创建一个对象来将整个表单存储在文件upload.vue
中;
data() {
//...
homeworkForm: {
title: '',
date: null,
somethingElse: ''
}
}
现在在您的表单中,您只需将v模型放置到homeworkForm对象中的每个对应键上;
<input v-model="homeworkForm.title" type="text" class="form-control" id="formGroupExampleInput" placeholder="Enter text">
<!-- ... -->
<datepicker v-model="homeworkForm.date" id="set_date" name="set_date" />
然后,当您要提交表单时,会将整个homeworkForm对象发送到vuex。
postHandler() {
this.$store.dispatch('createHomework', this.homeworkForm);
},