использование цикла v-for с v-model Object через 2 дочерних компонента

Возможно кто-то сталкивался с аналогичной ситуацией

Есть объект

 thing: {
   foo: [{
     number: 1,
     bar: { //какие то поля объекта }
   }, ... ],
   etc.
}

Необходимо передать объект с поддержкой реактивности через 2 дочерних компонента по следующей структуре

<!-- вызов компонента MyComponent1 -->
<myComponent1 v-model="thing">

<!-- содержимое компонента MyComponent1 -->
<div v-for="(elem, elemIndex) in thing.foo" :key="elem.number">
      <myComponent2 v-model="thing.foo[elemIndex]" />

В компоненте 'myComponent1' я инициализирую официальное решение по применению объектов в v-model, однако при рендере возникает ошибка. Uncaught (in promise) TypeError: Cannot read property 'number' of undefined at Proxy.render (QuizEditorPair.vue?9d4a:2)

upd:

<template>
    <div class="callout callout-secondary">
        <h3>Пара № {{pair.number}}</h3>
        <div class="input-group input-group-sm float-end col-4">
            <span class="input-group-text" id="inputGroup-sizing-sm">Таймер</span>
            <input type="number" class="form-control" v-model="self.time">
        </div>
        <div class="row">
            <div class="col-6">
            </div>
            <div class="col-6">Ответ</div>
        </div>
    </div>
</template>

<script>
import { defineComponent, computed } from "@vue/runtime-core";

export default defineComponent ({
    name: 'QuizEditorPair',
    emits: ['update:modelValue'],
    props: {
        modelValue: {
            type: Object,
            default: () => ({})
        }
    },
    setup(props, { emit }) {
    const self = computed({  // Use computed to wrap the object
      get: () => props.modelValue,
      set: (value) => emit('update:modelValue', value),
    });

    return { self };
  }
})
</script>