Error de expresión de Alpine: No se pueden leer propiedades de indefinido al eliminar datos de un par clave/valor en la consola.

Recibo los siguientes errores al usar la función removeData en el código a continuación.

<p>Alpine Expression Error: No se pueden leer las propiedades de undefined (leyendo 'nombre')
Expression: "datos[id].nombre"
<input x-model="datos[id].nombre" type="texto" name="nombre"></p>

<p>Alpine Expression Error: No se pueden leer las propiedades de undefined (leyendo 'texto')
Expression: "datos[id].texto"
<input x-model="datos[id].texto" type="texto" name="texto"></p>

<p>Todo parece funcionar correctamente, pero se genera un mensaje de error en la consola. ¿Hay alguna manera de evitar que esto ocurra?</p>

<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-js -->
function manipulador() {
  return {
    datos: {},
    obtenerDatos() {
      console.log(this.data);
    },
    agregarDatos() {
      x = Object.keys(this.data);
      x = x.map(function(x) {
        return parseInt(x, 10);
      }).sort();
      n = x[x.length - 1];
      if (isNaN(n)) {
        n = 0;
      };
      this.data[n + 1] = {
        'nombre': '',
        'texto': ''
      }
    },
    removeData(id) {
      delete this.data[id];
    },
  }
}

<!-- language: lang-html -->
<script src="//unpkg.com/alpinejs" defer=""></script>

<div x-data="manipulador()">
  <button type="button" @click="obtenerDatos()">MostrarDatos</button>
  <button type="button" @click="agregarDatos()">AgregarDatos</button>
  <template x-for="[id, valor] en Object.entries(datos)" :key="id">
    <div :id="id">
      <input x-model="id" type="number">
      <input x-model="datos[id].nombre" type="texto" name="nombre">
      <input x-model="datos[id].texto" type="texto" name="texto">
      <button type="button" @click="removeData(id)">Eliminar</button>
    </div>
  </template>
</div>

<!-- end snippet -->