Estoy tratando de representar ciertos componentes que están presentes en una matriz usando la etiqueta de componente de Vue js.

 <div v-for="(arr, index) in compArray"> <component v-bind:is="arr.name" :key="arr.name+index" :index="index"></component> </div> data() { compArray: [{name: "Abc"}, {name: "Xyz"}] }

Puedo agregar nuevos elementos a este compArray y que aumentarán los componentes que se representan. Pero cuando estoy eliminando, hay un problema con la interfaz de usuario (datos). Por ejemplo, si hay 3 componentes y los tres tienen un recuento de propiedades de datos.

Supongamos que para el primer elemento representado este recuento es 4, para el segundo es 5 y para el tercero es 2. Luego, si elimino el segundo elemento de compArray usando el método de corte, los datos que se muestran siguen siendo 5. En el caso ideal, debería ser 2, ya que el medio ha sido eliminado.

¿Cuál puede ser el problema detrás de esto? Cualquier ayuda es apreciada