Cuando trato de aplanar una matriz reactiva Vue 3 de objetos anidados, pierdo su reactividad y mi aplicación literalmente falla y bloquea la ventana del navegador.
El componente My Vue 3 define una matriz como una lista de objetos:
this.grouped = [ [this.tokens[0]], [this.tokens[1]], [this.tokens[2],this.tokens[3],this.tokens[4]], // nested [this.tokens[5]] ]Necesito tomar el segundo índice (donde la matriz anida 3 objetos) y aplanarlo para que la matriz resultante se vea como si se hubiera definido así:
this.grouped = [ [this.tokens[0]], [this.tokens[1]], [this.tokens[2]], //flattened [this.tokens[3]], //flattened [this.tokens[4]], //flattened [this.tokens[5]] ] Cuando trato de usar el splice para hacer esto, se pierde la reactividad (ejemplo a continuación, que muestra la reactividad perdida. ¿Alguna idea de cómo hacerlo?
Prueba Array#flat :
const res = this.grouped.flat();