Vue.js：如何连接 v-model 值

Question

如何使这项工作：

<div v-for="index in 4">
  <input v-model="'invoice_' + index" >
</div>

像这样：

<div v-for="index in 4">
  <input v-model="invoice_1" >
</div>

Answer 1

如果您将所有invoices_变量放在一个对象中，然后通过键引用它们，可能会更好，如下所示：

new Vue({
  el: '#app',
  data: {
    invoices: {
      invoice_1: '1',
      invoice_2: '2',
      invoice_3: '3',
      invoice_4: '4'
    }
  }
})

<script src="https://unpkg.com/vue@2.5.3/dist/vue.js"></script>

<div id="app">
  <div v-for="index in 4">
    <input v-model="invoices['invoice_' + index]">
  </div>
</div>