嵌套v-for-loop中的Vue: v-model

<template>
  <div>
    <div v-for="(group, index) in groups" :key="index">
      <div v-for="(item, i) in group.items" :key="i">
        <input type="text" v-model="getItemValue(group, item)" />
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      groups: [
        {
          items: [
            { value: 'Item 1' },
            { value: 'Item 2' },
            { value: 'Item 3' }
          ]
        },
        {
          items: [
            { value: 'Item 4' },
            { value: 'Item 5' },
            { value: 'Item 6' }
          ]
        }
      ]
    };
  },
  methods: {
    getItemValue(group, item) {
      return item.value;
    },
    setItemValue(group, item, newValue) {
      item.value = newValue;
    }
  }
};
</script>