表单中如何获取v-for循环里的值

在 Vue.js 中，在 `v-for` 循环中，可以使用 `v-model` 指令来绑定表单元素的值，然后使用 `$event.target.value` 来获取当前表单元素的值。在 `v-for` 循环中，可以使用 `$event.target` 来获取当前表单元素的引用，然后使用 `dataset` 属性来获取元素上的自定义数据。

例如，如果你有一个包含一组输入框的表单，并且使用 `v-for` 循环渲染每个输入框，你可以这样获取输入框中的值：

<template>
  <form>
    <div v-for="(item, index) in items" :key="index">
      <label :for="'input-' + index">{{ item.label }}</label>
      <input
        :id="'input-' + index"
        :name="item.name"
        :value="item.value"
        @input="updateValue(index, $event.target.value)"
      >
    </div>
  </form>
</template>

<script>
export default {
  data() {
    return {
      items: [
        { label: 'Name', name: 'name', value: '' },
        { label: 'Email', name: 'email', value: '' },
        { label: 'Phone', name: 'phone', value: '' },
      ],
    }
  },
  methods: {
    updateValue(index, value) {
      console.log(`Input ${index} value: ${value}`)
      console.log(`Input ${index} name: ${this.items[index].name}`)
    },
  },
}
</script>

在这个例子中，`updateValue` 方法接受两个参数：输入框的索引和输入框的值。在方法中，我们可以使用这些参数来获取当前输入框的值和名称，并将它们输出到控制台。