首页 > 解决方案 > 将多个输入设置为带索引的字符串

问题描述

我是 vue 新手,必须发送表格。后端给了我一个关于我的成员数组必须包含多少个字符串的数字。每个字符串都包含 firstName 和 lastName(例如 ["Peter Becker", "Henry White"])。因此 UI 必须有两个输入。我的表格看起来像这样

             <div v-for="(n, index) in retailer.slotCount" :key="index" 
               class="form-input">
                <b-form-group>
                  <label>Gast {{index + 1}}</label>
                  <b-row>
                    <b-col md="5">
                      <b-form-input v-model="form.firstName[index]" />
                    </b-col>
                    <b-col md="5">
                      <b-form-input v-model="form.lastName[index]" />
                    </b-col>
                  </b-row>
                </b-form-group>
              </div>

当我想发送表单两个我的 POST 操作时,我的问题就开始了

 methods: {
    bookDate() {
      this.$store
        .dispatch("sendBooking", {
          eventId: Math.floor(this.event.id),
          participants: `${this.form.firstName} ${this.form.lastName}`
        })
    }
  },

发送的数据是“firstName”、“firstname”、“lastName”、“lastName”

如何将 firstName 和 lastName 组合成一个字符串并将它们放入一个数组中。有没有人有一个快速的解决方案?

标签: vue.js

解决方案


您可以使用var thestring = yourIndex.toString;将所有索引设置为单个字符串。


推荐阅读